* {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box; }

html,
body {
  height: 100%;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased; }

body {
  background: #ffffff;
  font-size: 14px; }

:focus {
  outline: none; }

@media (max-width: 768px) {
  ::-webkit-scrollbar {
    display: none; } }

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

a {
  text-decoration: none;
  color: inherit;
  cursor: pointer; }

h1, h2, h3, h4, h5, h6, p, span, a {
  margin: 0;
  padding: 0; }

/*
This .scss loop will create "margin helpers" and "padding helpers" for use in your web projects.
It will generate several classes such as:
.m-r-10 which gives margin-right 10 pixels.
.m-r-15 gives MARGIN to the RIGHT 15 pixels.
.m-t-15 gives MARGIN to the TOP 15 pixels and so on.
.p-b-5 gives PADDING to the BOTTOM of 5 pixels
.p-l-40 gives PADDING to the LEFT of 40 pixels
The first letter is "m" or "p" for MARGIN or PADDING
Second letter is "t", "b", "l", or "r" for TOP, BOTTOM, LEFT, or RIGHT
Third letter is the number of spacing in pixels. Adjust the amounts generated by editing the $spaceamounts variable below.
*/
/*-------------------------------------------------------------------------------------------
    CSS Padding & Margin 1 to 100px Top, Bottom, Left, Right 
  -------------------------------------------------------------------------------------------*/
.m-t-0 {
  margin-top: 0px !important; }

.p-t-0 {
  padding-top: 0px !important; }

.m-b-0 {
  margin-bottom: 0px !important; }

.p-b-0 {
  padding-bottom: 0px !important; }

.m-l-0 {
  margin-left: 0px !important; }

.p-l-0 {
  padding-left: 0px !important; }

.m-r-0 {
  margin-right: 0px !important; }

.p-r-0 {
  padding-right: 0px !important; }

.m-0 {
  margin: 0px !important; }

.p-0 {
  padding: 0px !important; }

.m-t-4 {
  margin-top: 4px !important; }

.p-t-4 {
  padding-top: 4px !important; }

.m-b-4 {
  margin-bottom: 4px !important; }

.p-b-4 {
  padding-bottom: 4px !important; }

.m-l-4 {
  margin-left: 4px !important; }

.p-l-4 {
  padding-left: 4px !important; }

.m-r-4 {
  margin-right: 4px !important; }

.p-r-4 {
  padding-right: 4px !important; }

.m-4 {
  margin: 4px !important; }

.p-4 {
  padding: 4px !important; }

.m-t-6 {
  margin-top: 6px !important; }

.p-t-6 {
  padding-top: 6px !important; }

.m-b-6 {
  margin-bottom: 6px !important; }

.p-b-6 {
  padding-bottom: 6px !important; }

.m-l-6 {
  margin-left: 6px !important; }

.p-l-6 {
  padding-left: 6px !important; }

.m-r-6 {
  margin-right: 6px !important; }

.p-r-6 {
  padding-right: 6px !important; }

.m-6 {
  margin: 6px !important; }

.p-6 {
  padding: 6px !important; }

.m-t-8 {
  margin-top: 8px !important; }

.p-t-8 {
  padding-top: 8px !important; }

.m-b-8 {
  margin-bottom: 8px !important; }

.p-b-8 {
  padding-bottom: 8px !important; }

.m-l-8 {
  margin-left: 8px !important; }

.p-l-8 {
  padding-left: 8px !important; }

.m-r-8 {
  margin-right: 8px !important; }

.p-r-8 {
  padding-right: 8px !important; }

.m-8 {
  margin: 8px !important; }

.p-8 {
  padding: 8px !important; }

.m-t-10 {
  margin-top: 10px !important; }

.p-t-10 {
  padding-top: 10px !important; }

.m-b-10 {
  margin-bottom: 10px !important; }

.p-b-10 {
  padding-bottom: 10px !important; }

.m-l-10 {
  margin-left: 10px !important; }

.p-l-10 {
  padding-left: 10px !important; }

.m-r-10 {
  margin-right: 10px !important; }

.p-r-10 {
  padding-right: 10px !important; }

.m-10 {
  margin: 10px !important; }

.p-10 {
  padding: 10px !important; }

.m-t-12 {
  margin-top: 12px !important; }

.p-t-12 {
  padding-top: 12px !important; }

.m-b-12 {
  margin-bottom: 12px !important; }

.p-b-12 {
  padding-bottom: 12px !important; }

.m-l-12 {
  margin-left: 12px !important; }

.p-l-12 {
  padding-left: 12px !important; }

.m-r-12 {
  margin-right: 12px !important; }

.p-r-12 {
  padding-right: 12px !important; }

.m-12 {
  margin: 12px !important; }

.p-12 {
  padding: 12px !important; }

.m-t-14 {
  margin-top: 14px !important; }

.p-t-14 {
  padding-top: 14px !important; }

.m-b-14 {
  margin-bottom: 14px !important; }

.p-b-14 {
  padding-bottom: 14px !important; }

.m-l-14 {
  margin-left: 14px !important; }

.p-l-14 {
  padding-left: 14px !important; }

.m-r-14 {
  margin-right: 14px !important; }

.p-r-14 {
  padding-right: 14px !important; }

.m-14 {
  margin: 14px !important; }

.p-14 {
  padding: 14px !important; }

.m-t-16 {
  margin-top: 16px !important; }

.p-t-16 {
  padding-top: 16px !important; }

.m-b-16 {
  margin-bottom: 16px !important; }

.p-b-16 {
  padding-bottom: 16px !important; }

.m-l-16 {
  margin-left: 16px !important; }

.p-l-16 {
  padding-left: 16px !important; }

.m-r-16 {
  margin-right: 16px !important; }

.p-r-16 {
  padding-right: 16px !important; }

.m-16 {
  margin: 16px !important; }

.p-16 {
  padding: 16px !important; }

.m-t-18 {
  margin-top: 18px !important; }

.p-t-18 {
  padding-top: 18px !important; }

.m-b-18 {
  margin-bottom: 18px !important; }

.p-b-18 {
  padding-bottom: 18px !important; }

.m-l-18 {
  margin-left: 18px !important; }

.p-l-18 {
  padding-left: 18px !important; }

.m-r-18 {
  margin-right: 18px !important; }

.p-r-18 {
  padding-right: 18px !important; }

.m-18 {
  margin: 18px !important; }

.p-18 {
  padding: 18px !important; }

.m-t-20 {
  margin-top: 20px !important; }

.p-t-20 {
  padding-top: 20px !important; }

.m-b-20 {
  margin-bottom: 20px !important; }

.p-b-20 {
  padding-bottom: 20px !important; }

.m-l-20 {
  margin-left: 20px !important; }

.p-l-20 {
  padding-left: 20px !important; }

.m-r-20 {
  margin-right: 20px !important; }

.p-r-20 {
  padding-right: 20px !important; }

.m-20 {
  margin: 20px !important; }

.p-20 {
  padding: 20px !important; }

.m-t-21 {
  margin-top: 21px !important; }

.p-t-21 {
  padding-top: 21px !important; }

.m-b-21 {
  margin-bottom: 21px !important; }

.p-b-21 {
  padding-bottom: 21px !important; }

.m-l-21 {
  margin-left: 21px !important; }

.p-l-21 {
  padding-left: 21px !important; }

.m-r-21 {
  margin-right: 21px !important; }

.p-r-21 {
  padding-right: 21px !important; }

.m-21 {
  margin: 21px !important; }

.p-21 {
  padding: 21px !important; }

.m-t-22 {
  margin-top: 22px !important; }

.p-t-22 {
  padding-top: 22px !important; }

.m-b-22 {
  margin-bottom: 22px !important; }

.p-b-22 {
  padding-bottom: 22px !important; }

.m-l-22 {
  margin-left: 22px !important; }

.p-l-22 {
  padding-left: 22px !important; }

.m-r-22 {
  margin-right: 22px !important; }

.p-r-22 {
  padding-right: 22px !important; }

.m-22 {
  margin: 22px !important; }

.p-22 {
  padding: 22px !important; }

.m-t-24 {
  margin-top: 24px !important; }

.p-t-24 {
  padding-top: 24px !important; }

.m-b-24 {
  margin-bottom: 24px !important; }

.p-b-24 {
  padding-bottom: 24px !important; }

.m-l-24 {
  margin-left: 24px !important; }

.p-l-24 {
  padding-left: 24px !important; }

.m-r-24 {
  margin-right: 24px !important; }

.p-r-24 {
  padding-right: 24px !important; }

.m-24 {
  margin: 24px !important; }

.p-24 {
  padding: 24px !important; }

.m-t-26 {
  margin-top: 26px !important; }

.p-t-26 {
  padding-top: 26px !important; }

.m-b-26 {
  margin-bottom: 26px !important; }

.p-b-26 {
  padding-bottom: 26px !important; }

.m-l-26 {
  margin-left: 26px !important; }

.p-l-26 {
  padding-left: 26px !important; }

.m-r-26 {
  margin-right: 26px !important; }

.p-r-26 {
  padding-right: 26px !important; }

.m-26 {
  margin: 26px !important; }

.p-26 {
  padding: 26px !important; }

.m-t-28 {
  margin-top: 28px !important; }

.p-t-28 {
  padding-top: 28px !important; }

.m-b-28 {
  margin-bottom: 28px !important; }

.p-b-28 {
  padding-bottom: 28px !important; }

.m-l-28 {
  margin-left: 28px !important; }

.p-l-28 {
  padding-left: 28px !important; }

.m-r-28 {
  margin-right: 28px !important; }

.p-r-28 {
  padding-right: 28px !important; }

.m-28 {
  margin: 28px !important; }

.p-28 {
  padding: 28px !important; }

.m-t-30 {
  margin-top: 30px !important; }

.p-t-30 {
  padding-top: 30px !important; }

.m-b-30 {
  margin-bottom: 30px !important; }

.p-b-30 {
  padding-bottom: 30px !important; }

.m-l-30 {
  margin-left: 30px !important; }

.p-l-30 {
  padding-left: 30px !important; }

.m-r-30 {
  margin-right: 30px !important; }

.p-r-30 {
  padding-right: 30px !important; }

.m-30 {
  margin: 30px !important; }

.p-30 {
  padding: 30px !important; }

.m-t-32 {
  margin-top: 32px !important; }

.p-t-32 {
  padding-top: 32px !important; }

.m-b-32 {
  margin-bottom: 32px !important; }

.p-b-32 {
  padding-bottom: 32px !important; }

.m-l-32 {
  margin-left: 32px !important; }

.p-l-32 {
  padding-left: 32px !important; }

.m-r-32 {
  margin-right: 32px !important; }

.p-r-32 {
  padding-right: 32px !important; }

.m-32 {
  margin: 32px !important; }

.p-32 {
  padding: 32px !important; }

.m-t-34 {
  margin-top: 34px !important; }

.p-t-34 {
  padding-top: 34px !important; }

.m-b-34 {
  margin-bottom: 34px !important; }

.p-b-34 {
  padding-bottom: 34px !important; }

.m-l-34 {
  margin-left: 34px !important; }

.p-l-34 {
  padding-left: 34px !important; }

.m-r-34 {
  margin-right: 34px !important; }

.p-r-34 {
  padding-right: 34px !important; }

.m-34 {
  margin: 34px !important; }

.p-34 {
  padding: 34px !important; }

.m-t-36 {
  margin-top: 36px !important; }

.p-t-36 {
  padding-top: 36px !important; }

.m-b-36 {
  margin-bottom: 36px !important; }

.p-b-36 {
  padding-bottom: 36px !important; }

.m-l-36 {
  margin-left: 36px !important; }

.p-l-36 {
  padding-left: 36px !important; }

.m-r-36 {
  margin-right: 36px !important; }

.p-r-36 {
  padding-right: 36px !important; }

.m-36 {
  margin: 36px !important; }

.p-36 {
  padding: 36px !important; }

.m-t-38 {
  margin-top: 38px !important; }

.p-t-38 {
  padding-top: 38px !important; }

.m-b-38 {
  margin-bottom: 38px !important; }

.p-b-38 {
  padding-bottom: 38px !important; }

.m-l-38 {
  margin-left: 38px !important; }

.p-l-38 {
  padding-left: 38px !important; }

.m-r-38 {
  margin-right: 38px !important; }

.p-r-38 {
  padding-right: 38px !important; }

.m-38 {
  margin: 38px !important; }

.p-38 {
  padding: 38px !important; }

.m-t-40 {
  margin-top: 40px !important; }

.p-t-40 {
  padding-top: 40px !important; }

.m-b-40 {
  margin-bottom: 40px !important; }

.p-b-40 {
  padding-bottom: 40px !important; }

.m-l-40 {
  margin-left: 40px !important; }

.p-l-40 {
  padding-left: 40px !important; }

.m-r-40 {
  margin-right: 40px !important; }

.p-r-40 {
  padding-right: 40px !important; }

.m-40 {
  margin: 40px !important; }

.p-40 {
  padding: 40px !important; }

.m-t-42 {
  margin-top: 42px !important; }

.p-t-42 {
  padding-top: 42px !important; }

.m-b-42 {
  margin-bottom: 42px !important; }

.p-b-42 {
  padding-bottom: 42px !important; }

.m-l-42 {
  margin-left: 42px !important; }

.p-l-42 {
  padding-left: 42px !important; }

.m-r-42 {
  margin-right: 42px !important; }

.p-r-42 {
  padding-right: 42px !important; }

.m-42 {
  margin: 42px !important; }

.p-42 {
  padding: 42px !important; }

.m-t-44 {
  margin-top: 44px !important; }

.p-t-44 {
  padding-top: 44px !important; }

.m-b-44 {
  margin-bottom: 44px !important; }

.p-b-44 {
  padding-bottom: 44px !important; }

.m-l-44 {
  margin-left: 44px !important; }

.p-l-44 {
  padding-left: 44px !important; }

.m-r-44 {
  margin-right: 44px !important; }

.p-r-44 {
  padding-right: 44px !important; }

.m-44 {
  margin: 44px !important; }

.p-44 {
  padding: 44px !important; }

.m-t-46 {
  margin-top: 46px !important; }

.p-t-46 {
  padding-top: 46px !important; }

.m-b-46 {
  margin-bottom: 46px !important; }

.p-b-46 {
  padding-bottom: 46px !important; }

.m-l-46 {
  margin-left: 46px !important; }

.p-l-46 {
  padding-left: 46px !important; }

.m-r-46 {
  margin-right: 46px !important; }

.p-r-46 {
  padding-right: 46px !important; }

.m-46 {
  margin: 46px !important; }

.p-46 {
  padding: 46px !important; }

.m-t-48 {
  margin-top: 48px !important; }

.p-t-48 {
  padding-top: 48px !important; }

.m-b-48 {
  margin-bottom: 48px !important; }

.p-b-48 {
  padding-bottom: 48px !important; }

.m-l-48 {
  margin-left: 48px !important; }

.p-l-48 {
  padding-left: 48px !important; }

.m-r-48 {
  margin-right: 48px !important; }

.p-r-48 {
  padding-right: 48px !important; }

.m-48 {
  margin: 48px !important; }

.p-48 {
  padding: 48px !important; }

.m-t-50 {
  margin-top: 50px !important; }

.p-t-50 {
  padding-top: 50px !important; }

.m-b-50 {
  margin-bottom: 50px !important; }

.p-b-50 {
  padding-bottom: 50px !important; }

.m-l-50 {
  margin-left: 50px !important; }

.p-l-50 {
  padding-left: 50px !important; }

.m-r-50 {
  margin-right: 50px !important; }

.p-r-50 {
  padding-right: 50px !important; }

.m-50 {
  margin: 50px !important; }

.p-50 {
  padding: 50px !important; }

.m-t-52 {
  margin-top: 52px !important; }

.p-t-52 {
  padding-top: 52px !important; }

.m-b-52 {
  margin-bottom: 52px !important; }

.p-b-52 {
  padding-bottom: 52px !important; }

.m-l-52 {
  margin-left: 52px !important; }

.p-l-52 {
  padding-left: 52px !important; }

.m-r-52 {
  margin-right: 52px !important; }

.p-r-52 {
  padding-right: 52px !important; }

.m-52 {
  margin: 52px !important; }

.p-52 {
  padding: 52px !important; }

.m-t-54 {
  margin-top: 54px !important; }

.p-t-54 {
  padding-top: 54px !important; }

.m-b-54 {
  margin-bottom: 54px !important; }

.p-b-54 {
  padding-bottom: 54px !important; }

.m-l-54 {
  margin-left: 54px !important; }

.p-l-54 {
  padding-left: 54px !important; }

.m-r-54 {
  margin-right: 54px !important; }

.p-r-54 {
  padding-right: 54px !important; }

.m-54 {
  margin: 54px !important; }

.p-54 {
  padding: 54px !important; }

.m-t-56 {
  margin-top: 56px !important; }

.p-t-56 {
  padding-top: 56px !important; }

.m-b-56 {
  margin-bottom: 56px !important; }

.p-b-56 {
  padding-bottom: 56px !important; }

.m-l-56 {
  margin-left: 56px !important; }

.p-l-56 {
  padding-left: 56px !important; }

.m-r-56 {
  margin-right: 56px !important; }

.p-r-56 {
  padding-right: 56px !important; }

.m-56 {
  margin: 56px !important; }

.p-56 {
  padding: 56px !important; }

.m-t-58 {
  margin-top: 58px !important; }

.p-t-58 {
  padding-top: 58px !important; }

.m-b-58 {
  margin-bottom: 58px !important; }

.p-b-58 {
  padding-bottom: 58px !important; }

.m-l-58 {
  margin-left: 58px !important; }

.p-l-58 {
  padding-left: 58px !important; }

.m-r-58 {
  margin-right: 58px !important; }

.p-r-58 {
  padding-right: 58px !important; }

.m-58 {
  margin: 58px !important; }

.p-58 {
  padding: 58px !important; }

.m-t-59 {
  margin-top: 59px !important; }

.p-t-59 {
  padding-top: 59px !important; }

.m-b-59 {
  margin-bottom: 59px !important; }

.p-b-59 {
  padding-bottom: 59px !important; }

.m-l-59 {
  margin-left: 59px !important; }

.p-l-59 {
  padding-left: 59px !important; }

.m-r-59 {
  margin-right: 59px !important; }

.p-r-59 {
  padding-right: 59px !important; }

.m-59 {
  margin: 59px !important; }

.p-59 {
  padding: 59px !important; }

.m-t-60 {
  margin-top: 60px !important; }

.p-t-60 {
  padding-top: 60px !important; }

.m-b-60 {
  margin-bottom: 60px !important; }

.p-b-60 {
  padding-bottom: 60px !important; }

.m-l-60 {
  margin-left: 60px !important; }

.p-l-60 {
  padding-left: 60px !important; }

.m-r-60 {
  margin-right: 60px !important; }

.p-r-60 {
  padding-right: 60px !important; }

.m-60 {
  margin: 60px !important; }

.p-60 {
  padding: 60px !important; }

.m-t-62 {
  margin-top: 62px !important; }

.p-t-62 {
  padding-top: 62px !important; }

.m-b-62 {
  margin-bottom: 62px !important; }

.p-b-62 {
  padding-bottom: 62px !important; }

.m-l-62 {
  margin-left: 62px !important; }

.p-l-62 {
  padding-left: 62px !important; }

.m-r-62 {
  margin-right: 62px !important; }

.p-r-62 {
  padding-right: 62px !important; }

.m-62 {
  margin: 62px !important; }

.p-62 {
  padding: 62px !important; }

.m-t-64 {
  margin-top: 64px !important; }

.p-t-64 {
  padding-top: 64px !important; }

.m-b-64 {
  margin-bottom: 64px !important; }

.p-b-64 {
  padding-bottom: 64px !important; }

.m-l-64 {
  margin-left: 64px !important; }

.p-l-64 {
  padding-left: 64px !important; }

.m-r-64 {
  margin-right: 64px !important; }

.p-r-64 {
  padding-right: 64px !important; }

.m-64 {
  margin: 64px !important; }

.p-64 {
  padding: 64px !important; }

.m-t-66 {
  margin-top: 66px !important; }

.p-t-66 {
  padding-top: 66px !important; }

.m-b-66 {
  margin-bottom: 66px !important; }

.p-b-66 {
  padding-bottom: 66px !important; }

.m-l-66 {
  margin-left: 66px !important; }

.p-l-66 {
  padding-left: 66px !important; }

.m-r-66 {
  margin-right: 66px !important; }

.p-r-66 {
  padding-right: 66px !important; }

.m-66 {
  margin: 66px !important; }

.p-66 {
  padding: 66px !important; }

.m-t-68 {
  margin-top: 68px !important; }

.p-t-68 {
  padding-top: 68px !important; }

.m-b-68 {
  margin-bottom: 68px !important; }

.p-b-68 {
  padding-bottom: 68px !important; }

.m-l-68 {
  margin-left: 68px !important; }

.p-l-68 {
  padding-left: 68px !important; }

.m-r-68 {
  margin-right: 68px !important; }

.p-r-68 {
  padding-right: 68px !important; }

.m-68 {
  margin: 68px !important; }

.p-68 {
  padding: 68px !important; }

.m-t-70 {
  margin-top: 70px !important; }

.p-t-70 {
  padding-top: 70px !important; }

.m-b-70 {
  margin-bottom: 70px !important; }

.p-b-70 {
  padding-bottom: 70px !important; }

.m-l-70 {
  margin-left: 70px !important; }

.p-l-70 {
  padding-left: 70px !important; }

.m-r-70 {
  margin-right: 70px !important; }

.p-r-70 {
  padding-right: 70px !important; }

.m-70 {
  margin: 70px !important; }

.p-70 {
  padding: 70px !important; }

.m-t-72 {
  margin-top: 72px !important; }

.p-t-72 {
  padding-top: 72px !important; }

.m-b-72 {
  margin-bottom: 72px !important; }

.p-b-72 {
  padding-bottom: 72px !important; }

.m-l-72 {
  margin-left: 72px !important; }

.p-l-72 {
  padding-left: 72px !important; }

.m-r-72 {
  margin-right: 72px !important; }

.p-r-72 {
  padding-right: 72px !important; }

.m-72 {
  margin: 72px !important; }

.p-72 {
  padding: 72px !important; }

.m-t-74 {
  margin-top: 74px !important; }

.p-t-74 {
  padding-top: 74px !important; }

.m-b-74 {
  margin-bottom: 74px !important; }

.p-b-74 {
  padding-bottom: 74px !important; }

.m-l-74 {
  margin-left: 74px !important; }

.p-l-74 {
  padding-left: 74px !important; }

.m-r-74 {
  margin-right: 74px !important; }

.p-r-74 {
  padding-right: 74px !important; }

.m-74 {
  margin: 74px !important; }

.p-74 {
  padding: 74px !important; }

.m-t-76 {
  margin-top: 76px !important; }

.p-t-76 {
  padding-top: 76px !important; }

.m-b-76 {
  margin-bottom: 76px !important; }

.p-b-76 {
  padding-bottom: 76px !important; }

.m-l-76 {
  margin-left: 76px !important; }

.p-l-76 {
  padding-left: 76px !important; }

.m-r-76 {
  margin-right: 76px !important; }

.p-r-76 {
  padding-right: 76px !important; }

.m-76 {
  margin: 76px !important; }

.p-76 {
  padding: 76px !important; }

.m-t-78 {
  margin-top: 78px !important; }

.p-t-78 {
  padding-top: 78px !important; }

.m-b-78 {
  margin-bottom: 78px !important; }

.p-b-78 {
  padding-bottom: 78px !important; }

.m-l-78 {
  margin-left: 78px !important; }

.p-l-78 {
  padding-left: 78px !important; }

.m-r-78 {
  margin-right: 78px !important; }

.p-r-78 {
  padding-right: 78px !important; }

.m-78 {
  margin: 78px !important; }

.p-78 {
  padding: 78px !important; }

.m-t-80 {
  margin-top: 80px !important; }

.p-t-80 {
  padding-top: 80px !important; }

.m-b-80 {
  margin-bottom: 80px !important; }

.p-b-80 {
  padding-bottom: 80px !important; }

.m-l-80 {
  margin-left: 80px !important; }

.p-l-80 {
  padding-left: 80px !important; }

.m-r-80 {
  margin-right: 80px !important; }

.p-r-80 {
  padding-right: 80px !important; }

.m-80 {
  margin: 80px !important; }

.p-80 {
  padding: 80px !important; }

.m-t-82 {
  margin-top: 82px !important; }

.p-t-82 {
  padding-top: 82px !important; }

.m-b-82 {
  margin-bottom: 82px !important; }

.p-b-82 {
  padding-bottom: 82px !important; }

.m-l-82 {
  margin-left: 82px !important; }

.p-l-82 {
  padding-left: 82px !important; }

.m-r-82 {
  margin-right: 82px !important; }

.p-r-82 {
  padding-right: 82px !important; }

.m-82 {
  margin: 82px !important; }

.p-82 {
  padding: 82px !important; }

.m-t-84 {
  margin-top: 84px !important; }

.p-t-84 {
  padding-top: 84px !important; }

.m-b-84 {
  margin-bottom: 84px !important; }

.p-b-84 {
  padding-bottom: 84px !important; }

.m-l-84 {
  margin-left: 84px !important; }

.p-l-84 {
  padding-left: 84px !important; }

.m-r-84 {
  margin-right: 84px !important; }

.p-r-84 {
  padding-right: 84px !important; }

.m-84 {
  margin: 84px !important; }

.p-84 {
  padding: 84px !important; }

.m-t-86 {
  margin-top: 86px !important; }

.p-t-86 {
  padding-top: 86px !important; }

.m-b-86 {
  margin-bottom: 86px !important; }

.p-b-86 {
  padding-bottom: 86px !important; }

.m-l-86 {
  margin-left: 86px !important; }

.p-l-86 {
  padding-left: 86px !important; }

.m-r-86 {
  margin-right: 86px !important; }

.p-r-86 {
  padding-right: 86px !important; }

.m-86 {
  margin: 86px !important; }

.p-86 {
  padding: 86px !important; }

.m-t-88 {
  margin-top: 88px !important; }

.p-t-88 {
  padding-top: 88px !important; }

.m-b-88 {
  margin-bottom: 88px !important; }

.p-b-88 {
  padding-bottom: 88px !important; }

.m-l-88 {
  margin-left: 88px !important; }

.p-l-88 {
  padding-left: 88px !important; }

.m-r-88 {
  margin-right: 88px !important; }

.p-r-88 {
  padding-right: 88px !important; }

.m-88 {
  margin: 88px !important; }

.p-88 {
  padding: 88px !important; }

.m-t-90 {
  margin-top: 90px !important; }

.p-t-90 {
  padding-top: 90px !important; }

.m-b-90 {
  margin-bottom: 90px !important; }

.p-b-90 {
  padding-bottom: 90px !important; }

.m-l-90 {
  margin-left: 90px !important; }

.p-l-90 {
  padding-left: 90px !important; }

.m-r-90 {
  margin-right: 90px !important; }

.p-r-90 {
  padding-right: 90px !important; }

.m-90 {
  margin: 90px !important; }

.p-90 {
  padding: 90px !important; }

.m-t-92 {
  margin-top: 92px !important; }

.p-t-92 {
  padding-top: 92px !important; }

.m-b-92 {
  margin-bottom: 92px !important; }

.p-b-92 {
  padding-bottom: 92px !important; }

.m-l-92 {
  margin-left: 92px !important; }

.p-l-92 {
  padding-left: 92px !important; }

.m-r-92 {
  margin-right: 92px !important; }

.p-r-92 {
  padding-right: 92px !important; }

.m-92 {
  margin: 92px !important; }

.p-92 {
  padding: 92px !important; }

.m-t-94 {
  margin-top: 94px !important; }

.p-t-94 {
  padding-top: 94px !important; }

.m-b-94 {
  margin-bottom: 94px !important; }

.p-b-94 {
  padding-bottom: 94px !important; }

.m-l-94 {
  margin-left: 94px !important; }

.p-l-94 {
  padding-left: 94px !important; }

.m-r-94 {
  margin-right: 94px !important; }

.p-r-94 {
  padding-right: 94px !important; }

.m-94 {
  margin: 94px !important; }

.p-94 {
  padding: 94px !important; }

.m-t-96 {
  margin-top: 96px !important; }

.p-t-96 {
  padding-top: 96px !important; }

.m-b-96 {
  margin-bottom: 96px !important; }

.p-b-96 {
  padding-bottom: 96px !important; }

.m-l-96 {
  margin-left: 96px !important; }

.p-l-96 {
  padding-left: 96px !important; }

.m-r-96 {
  margin-right: 96px !important; }

.p-r-96 {
  padding-right: 96px !important; }

.m-96 {
  margin: 96px !important; }

.p-96 {
  padding: 96px !important; }

.m-t-98 {
  margin-top: 98px !important; }

.p-t-98 {
  padding-top: 98px !important; }

.m-b-98 {
  margin-bottom: 98px !important; }

.p-b-98 {
  padding-bottom: 98px !important; }

.m-l-98 {
  margin-left: 98px !important; }

.p-l-98 {
  padding-left: 98px !important; }

.m-r-98 {
  margin-right: 98px !important; }

.p-r-98 {
  padding-right: 98px !important; }

.m-98 {
  margin: 98px !important; }

.p-98 {
  padding: 98px !important; }

.m-t-100 {
  margin-top: 100px !important; }

.p-t-100 {
  padding-top: 100px !important; }

.m-b-100 {
  margin-bottom: 100px !important; }

.p-b-100 {
  padding-bottom: 100px !important; }

.m-l-100 {
  margin-left: 100px !important; }

.p-l-100 {
  padding-left: 100px !important; }

.m-r-100 {
  margin-right: 100px !important; }

.p-r-100 {
  padding-right: 100px !important; }

.m-100 {
  margin: 100px !important; }

.p-100 {
  padding: 100px !important; }

.m-t-104 {
  margin-top: 104px !important; }

.p-t-104 {
  padding-top: 104px !important; }

.m-b-104 {
  margin-bottom: 104px !important; }

.p-b-104 {
  padding-bottom: 104px !important; }

.m-l-104 {
  margin-left: 104px !important; }

.p-l-104 {
  padding-left: 104px !important; }

.m-r-104 {
  margin-right: 104px !important; }

.p-r-104 {
  padding-right: 104px !important; }

.m-104 {
  margin: 104px !important; }

.p-104 {
  padding: 104px !important; }

.m-t-108 {
  margin-top: 108px !important; }

.p-t-108 {
  padding-top: 108px !important; }

.m-b-108 {
  margin-bottom: 108px !important; }

.p-b-108 {
  padding-bottom: 108px !important; }

.m-l-108 {
  margin-left: 108px !important; }

.p-l-108 {
  padding-left: 108px !important; }

.m-r-108 {
  margin-right: 108px !important; }

.p-r-108 {
  padding-right: 108px !important; }

.m-108 {
  margin: 108px !important; }

.p-108 {
  padding: 108px !important; }

.m-t-110 {
  margin-top: 110px !important; }

.p-t-110 {
  padding-top: 110px !important; }

.m-b-110 {
  margin-bottom: 110px !important; }

.p-b-110 {
  padding-bottom: 110px !important; }

.m-l-110 {
  margin-left: 110px !important; }

.p-l-110 {
  padding-left: 110px !important; }

.m-r-110 {
  margin-right: 110px !important; }

.p-r-110 {
  padding-right: 110px !important; }

.m-110 {
  margin: 110px !important; }

.p-110 {
  padding: 110px !important; }

.m-t-112 {
  margin-top: 112px !important; }

.p-t-112 {
  padding-top: 112px !important; }

.m-b-112 {
  margin-bottom: 112px !important; }

.p-b-112 {
  padding-bottom: 112px !important; }

.m-l-112 {
  margin-left: 112px !important; }

.p-l-112 {
  padding-left: 112px !important; }

.m-r-112 {
  margin-right: 112px !important; }

.p-r-112 {
  padding-right: 112px !important; }

.m-112 {
  margin: 112px !important; }

.p-112 {
  padding: 112px !important; }

.m-t-114 {
  margin-top: 114px !important; }

.p-t-114 {
  padding-top: 114px !important; }

.m-b-114 {
  margin-bottom: 114px !important; }

.p-b-114 {
  padding-bottom: 114px !important; }

.m-l-114 {
  margin-left: 114px !important; }

.p-l-114 {
  padding-left: 114px !important; }

.m-r-114 {
  margin-right: 114px !important; }

.p-r-114 {
  padding-right: 114px !important; }

.m-114 {
  margin: 114px !important; }

.p-114 {
  padding: 114px !important; }

.m-t-116 {
  margin-top: 116px !important; }

.p-t-116 {
  padding-top: 116px !important; }

.m-b-116 {
  margin-bottom: 116px !important; }

.p-b-116 {
  padding-bottom: 116px !important; }

.m-l-116 {
  margin-left: 116px !important; }

.p-l-116 {
  padding-left: 116px !important; }

.m-r-116 {
  margin-right: 116px !important; }

.p-r-116 {
  padding-right: 116px !important; }

.m-116 {
  margin: 116px !important; }

.p-116 {
  padding: 116px !important; }

.m-t-118 {
  margin-top: 118px !important; }

.p-t-118 {
  padding-top: 118px !important; }

.m-b-118 {
  margin-bottom: 118px !important; }

.p-b-118 {
  padding-bottom: 118px !important; }

.m-l-118 {
  margin-left: 118px !important; }

.p-l-118 {
  padding-left: 118px !important; }

.m-r-118 {
  margin-right: 118px !important; }

.p-r-118 {
  padding-right: 118px !important; }

.m-118 {
  margin: 118px !important; }

.p-118 {
  padding: 118px !important; }

.m-t-120 {
  margin-top: 120px !important; }

.p-t-120 {
  padding-top: 120px !important; }

.m-b-120 {
  margin-bottom: 120px !important; }

.p-b-120 {
  padding-bottom: 120px !important; }

.m-l-120 {
  margin-left: 120px !important; }

.p-l-120 {
  padding-left: 120px !important; }

.m-r-120 {
  margin-right: 120px !important; }

.p-r-120 {
  padding-right: 120px !important; }

.m-120 {
  margin: 120px !important; }

.p-120 {
  padding: 120px !important; }

.m-t-122 {
  margin-top: 122px !important; }

.p-t-122 {
  padding-top: 122px !important; }

.m-b-122 {
  margin-bottom: 122px !important; }

.p-b-122 {
  padding-bottom: 122px !important; }

.m-l-122 {
  margin-left: 122px !important; }

.p-l-122 {
  padding-left: 122px !important; }

.m-r-122 {
  margin-right: 122px !important; }

.p-r-122 {
  padding-right: 122px !important; }

.m-122 {
  margin: 122px !important; }

.p-122 {
  padding: 122px !important; }

.m-t-124 {
  margin-top: 124px !important; }

.p-t-124 {
  padding-top: 124px !important; }

.m-b-124 {
  margin-bottom: 124px !important; }

.p-b-124 {
  padding-bottom: 124px !important; }

.m-l-124 {
  margin-left: 124px !important; }

.p-l-124 {
  padding-left: 124px !important; }

.m-r-124 {
  margin-right: 124px !important; }

.p-r-124 {
  padding-right: 124px !important; }

.m-124 {
  margin: 124px !important; }

.p-124 {
  padding: 124px !important; }

@media (max-width: 767px) {
  .xs-m-t-0 {
    margin-top: 0px !important; }

  .xs-p-t-0 {
    padding-top: 0px !important; }

  .xs-m-b-0 {
    margin-bottom: 0px !important; }

  .xs-p-b-0 {
    padding-bottom: 0px !important; }

  .xs-m-l-0 {
    margin-left: 0px !important; }

  .xs-p-l-0 {
    padding-left: 0px !important; }

  .xs-m-r-0 {
    margin-right: 0px !important; }

  .xs-p-r-0 {
    padding-right: 0px !important; }

  .xs-m-0 {
    margin: 0px !important; }

  .xs-p-0 {
    padding: 0px !important; }

  .xs-m-t-4 {
    margin-top: 4px !important; }

  .xs-p-t-4 {
    padding-top: 4px !important; }

  .xs-m-b-4 {
    margin-bottom: 4px !important; }

  .xs-p-b-4 {
    padding-bottom: 4px !important; }

  .xs-m-l-4 {
    margin-left: 4px !important; }

  .xs-p-l-4 {
    padding-left: 4px !important; }

  .xs-m-r-4 {
    margin-right: 4px !important; }

  .xs-p-r-4 {
    padding-right: 4px !important; }

  .xs-m-4 {
    margin: 4px !important; }

  .xs-p-4 {
    padding: 4px !important; }

  .xs-m-t-6 {
    margin-top: 6px !important; }

  .xs-p-t-6 {
    padding-top: 6px !important; }

  .xs-m-b-6 {
    margin-bottom: 6px !important; }

  .xs-p-b-6 {
    padding-bottom: 6px !important; }

  .xs-m-l-6 {
    margin-left: 6px !important; }

  .xs-p-l-6 {
    padding-left: 6px !important; }

  .xs-m-r-6 {
    margin-right: 6px !important; }

  .xs-p-r-6 {
    padding-right: 6px !important; }

  .xs-m-6 {
    margin: 6px !important; }

  .xs-p-6 {
    padding: 6px !important; }

  .xs-m-t-8 {
    margin-top: 8px !important; }

  .xs-p-t-8 {
    padding-top: 8px !important; }

  .xs-m-b-8 {
    margin-bottom: 8px !important; }

  .xs-p-b-8 {
    padding-bottom: 8px !important; }

  .xs-m-l-8 {
    margin-left: 8px !important; }

  .xs-p-l-8 {
    padding-left: 8px !important; }

  .xs-m-r-8 {
    margin-right: 8px !important; }

  .xs-p-r-8 {
    padding-right: 8px !important; }

  .xs-m-8 {
    margin: 8px !important; }

  .xs-p-8 {
    padding: 8px !important; }

  .xs-m-t-10 {
    margin-top: 10px !important; }

  .xs-p-t-10 {
    padding-top: 10px !important; }

  .xs-m-b-10 {
    margin-bottom: 10px !important; }

  .xs-p-b-10 {
    padding-bottom: 10px !important; }

  .xs-m-l-10 {
    margin-left: 10px !important; }

  .xs-p-l-10 {
    padding-left: 10px !important; }

  .xs-m-r-10 {
    margin-right: 10px !important; }

  .xs-p-r-10 {
    padding-right: 10px !important; }

  .xs-m-10 {
    margin: 10px !important; }

  .xs-p-10 {
    padding: 10px !important; }

  .xs-m-t-12 {
    margin-top: 12px !important; }

  .xs-p-t-12 {
    padding-top: 12px !important; }

  .xs-m-b-12 {
    margin-bottom: 12px !important; }

  .xs-p-b-12 {
    padding-bottom: 12px !important; }

  .xs-m-l-12 {
    margin-left: 12px !important; }

  .xs-p-l-12 {
    padding-left: 12px !important; }

  .xs-m-r-12 {
    margin-right: 12px !important; }

  .xs-p-r-12 {
    padding-right: 12px !important; }

  .xs-m-12 {
    margin: 12px !important; }

  .xs-p-12 {
    padding: 12px !important; }

  .xs-m-t-14 {
    margin-top: 14px !important; }

  .xs-p-t-14 {
    padding-top: 14px !important; }

  .xs-m-b-14 {
    margin-bottom: 14px !important; }

  .xs-p-b-14 {
    padding-bottom: 14px !important; }

  .xs-m-l-14 {
    margin-left: 14px !important; }

  .xs-p-l-14 {
    padding-left: 14px !important; }

  .xs-m-r-14 {
    margin-right: 14px !important; }

  .xs-p-r-14 {
    padding-right: 14px !important; }

  .xs-m-14 {
    margin: 14px !important; }

  .xs-p-14 {
    padding: 14px !important; }

  .xs-m-t-16 {
    margin-top: 16px !important; }

  .xs-p-t-16 {
    padding-top: 16px !important; }

  .xs-m-b-16 {
    margin-bottom: 16px !important; }

  .xs-p-b-16 {
    padding-bottom: 16px !important; }

  .xs-m-l-16 {
    margin-left: 16px !important; }

  .xs-p-l-16 {
    padding-left: 16px !important; }

  .xs-m-r-16 {
    margin-right: 16px !important; }

  .xs-p-r-16 {
    padding-right: 16px !important; }

  .xs-m-16 {
    margin: 16px !important; }

  .xs-p-16 {
    padding: 16px !important; }

  .xs-m-t-18 {
    margin-top: 18px !important; }

  .xs-p-t-18 {
    padding-top: 18px !important; }

  .xs-m-b-18 {
    margin-bottom: 18px !important; }

  .xs-p-b-18 {
    padding-bottom: 18px !important; }

  .xs-m-l-18 {
    margin-left: 18px !important; }

  .xs-p-l-18 {
    padding-left: 18px !important; }

  .xs-m-r-18 {
    margin-right: 18px !important; }

  .xs-p-r-18 {
    padding-right: 18px !important; }

  .xs-m-18 {
    margin: 18px !important; }

  .xs-p-18 {
    padding: 18px !important; }

  .xs-m-t-20 {
    margin-top: 20px !important; }

  .xs-p-t-20 {
    padding-top: 20px !important; }

  .xs-m-b-20 {
    margin-bottom: 20px !important; }

  .xs-p-b-20 {
    padding-bottom: 20px !important; }

  .xs-m-l-20 {
    margin-left: 20px !important; }

  .xs-p-l-20 {
    padding-left: 20px !important; }

  .xs-m-r-20 {
    margin-right: 20px !important; }

  .xs-p-r-20 {
    padding-right: 20px !important; }

  .xs-m-20 {
    margin: 20px !important; }

  .xs-p-20 {
    padding: 20px !important; }

  .xs-m-t-21 {
    margin-top: 21px !important; }

  .xs-p-t-21 {
    padding-top: 21px !important; }

  .xs-m-b-21 {
    margin-bottom: 21px !important; }

  .xs-p-b-21 {
    padding-bottom: 21px !important; }

  .xs-m-l-21 {
    margin-left: 21px !important; }

  .xs-p-l-21 {
    padding-left: 21px !important; }

  .xs-m-r-21 {
    margin-right: 21px !important; }

  .xs-p-r-21 {
    padding-right: 21px !important; }

  .xs-m-21 {
    margin: 21px !important; }

  .xs-p-21 {
    padding: 21px !important; }

  .xs-m-t-22 {
    margin-top: 22px !important; }

  .xs-p-t-22 {
    padding-top: 22px !important; }

  .xs-m-b-22 {
    margin-bottom: 22px !important; }

  .xs-p-b-22 {
    padding-bottom: 22px !important; }

  .xs-m-l-22 {
    margin-left: 22px !important; }

  .xs-p-l-22 {
    padding-left: 22px !important; }

  .xs-m-r-22 {
    margin-right: 22px !important; }

  .xs-p-r-22 {
    padding-right: 22px !important; }

  .xs-m-22 {
    margin: 22px !important; }

  .xs-p-22 {
    padding: 22px !important; }

  .xs-m-t-24 {
    margin-top: 24px !important; }

  .xs-p-t-24 {
    padding-top: 24px !important; }

  .xs-m-b-24 {
    margin-bottom: 24px !important; }

  .xs-p-b-24 {
    padding-bottom: 24px !important; }

  .xs-m-l-24 {
    margin-left: 24px !important; }

  .xs-p-l-24 {
    padding-left: 24px !important; }

  .xs-m-r-24 {
    margin-right: 24px !important; }

  .xs-p-r-24 {
    padding-right: 24px !important; }

  .xs-m-24 {
    margin: 24px !important; }

  .xs-p-24 {
    padding: 24px !important; }

  .xs-m-t-26 {
    margin-top: 26px !important; }

  .xs-p-t-26 {
    padding-top: 26px !important; }

  .xs-m-b-26 {
    margin-bottom: 26px !important; }

  .xs-p-b-26 {
    padding-bottom: 26px !important; }

  .xs-m-l-26 {
    margin-left: 26px !important; }

  .xs-p-l-26 {
    padding-left: 26px !important; }

  .xs-m-r-26 {
    margin-right: 26px !important; }

  .xs-p-r-26 {
    padding-right: 26px !important; }

  .xs-m-26 {
    margin: 26px !important; }

  .xs-p-26 {
    padding: 26px !important; }

  .xs-m-t-28 {
    margin-top: 28px !important; }

  .xs-p-t-28 {
    padding-top: 28px !important; }

  .xs-m-b-28 {
    margin-bottom: 28px !important; }

  .xs-p-b-28 {
    padding-bottom: 28px !important; }

  .xs-m-l-28 {
    margin-left: 28px !important; }

  .xs-p-l-28 {
    padding-left: 28px !important; }

  .xs-m-r-28 {
    margin-right: 28px !important; }

  .xs-p-r-28 {
    padding-right: 28px !important; }

  .xs-m-28 {
    margin: 28px !important; }

  .xs-p-28 {
    padding: 28px !important; }

  .xs-m-t-30 {
    margin-top: 30px !important; }

  .xs-p-t-30 {
    padding-top: 30px !important; }

  .xs-m-b-30 {
    margin-bottom: 30px !important; }

  .xs-p-b-30 {
    padding-bottom: 30px !important; }

  .xs-m-l-30 {
    margin-left: 30px !important; }

  .xs-p-l-30 {
    padding-left: 30px !important; }

  .xs-m-r-30 {
    margin-right: 30px !important; }

  .xs-p-r-30 {
    padding-right: 30px !important; }

  .xs-m-30 {
    margin: 30px !important; }

  .xs-p-30 {
    padding: 30px !important; }

  .xs-m-t-32 {
    margin-top: 32px !important; }

  .xs-p-t-32 {
    padding-top: 32px !important; }

  .xs-m-b-32 {
    margin-bottom: 32px !important; }

  .xs-p-b-32 {
    padding-bottom: 32px !important; }

  .xs-m-l-32 {
    margin-left: 32px !important; }

  .xs-p-l-32 {
    padding-left: 32px !important; }

  .xs-m-r-32 {
    margin-right: 32px !important; }

  .xs-p-r-32 {
    padding-right: 32px !important; }

  .xs-m-32 {
    margin: 32px !important; }

  .xs-p-32 {
    padding: 32px !important; }

  .xs-m-t-34 {
    margin-top: 34px !important; }

  .xs-p-t-34 {
    padding-top: 34px !important; }

  .xs-m-b-34 {
    margin-bottom: 34px !important; }

  .xs-p-b-34 {
    padding-bottom: 34px !important; }

  .xs-m-l-34 {
    margin-left: 34px !important; }

  .xs-p-l-34 {
    padding-left: 34px !important; }

  .xs-m-r-34 {
    margin-right: 34px !important; }

  .xs-p-r-34 {
    padding-right: 34px !important; }

  .xs-m-34 {
    margin: 34px !important; }

  .xs-p-34 {
    padding: 34px !important; }

  .xs-m-t-36 {
    margin-top: 36px !important; }

  .xs-p-t-36 {
    padding-top: 36px !important; }

  .xs-m-b-36 {
    margin-bottom: 36px !important; }

  .xs-p-b-36 {
    padding-bottom: 36px !important; }

  .xs-m-l-36 {
    margin-left: 36px !important; }

  .xs-p-l-36 {
    padding-left: 36px !important; }

  .xs-m-r-36 {
    margin-right: 36px !important; }

  .xs-p-r-36 {
    padding-right: 36px !important; }

  .xs-m-36 {
    margin: 36px !important; }

  .xs-p-36 {
    padding: 36px !important; }

  .xs-m-t-38 {
    margin-top: 38px !important; }

  .xs-p-t-38 {
    padding-top: 38px !important; }

  .xs-m-b-38 {
    margin-bottom: 38px !important; }

  .xs-p-b-38 {
    padding-bottom: 38px !important; }

  .xs-m-l-38 {
    margin-left: 38px !important; }

  .xs-p-l-38 {
    padding-left: 38px !important; }

  .xs-m-r-38 {
    margin-right: 38px !important; }

  .xs-p-r-38 {
    padding-right: 38px !important; }

  .xs-m-38 {
    margin: 38px !important; }

  .xs-p-38 {
    padding: 38px !important; }

  .xs-m-t-40 {
    margin-top: 40px !important; }

  .xs-p-t-40 {
    padding-top: 40px !important; }

  .xs-m-b-40 {
    margin-bottom: 40px !important; }

  .xs-p-b-40 {
    padding-bottom: 40px !important; }

  .xs-m-l-40 {
    margin-left: 40px !important; }

  .xs-p-l-40 {
    padding-left: 40px !important; }

  .xs-m-r-40 {
    margin-right: 40px !important; }

  .xs-p-r-40 {
    padding-right: 40px !important; }

  .xs-m-40 {
    margin: 40px !important; }

  .xs-p-40 {
    padding: 40px !important; }

  .xs-m-t-42 {
    margin-top: 42px !important; }

  .xs-p-t-42 {
    padding-top: 42px !important; }

  .xs-m-b-42 {
    margin-bottom: 42px !important; }

  .xs-p-b-42 {
    padding-bottom: 42px !important; }

  .xs-m-l-42 {
    margin-left: 42px !important; }

  .xs-p-l-42 {
    padding-left: 42px !important; }

  .xs-m-r-42 {
    margin-right: 42px !important; }

  .xs-p-r-42 {
    padding-right: 42px !important; }

  .xs-m-42 {
    margin: 42px !important; }

  .xs-p-42 {
    padding: 42px !important; }

  .xs-m-t-44 {
    margin-top: 44px !important; }

  .xs-p-t-44 {
    padding-top: 44px !important; }

  .xs-m-b-44 {
    margin-bottom: 44px !important; }

  .xs-p-b-44 {
    padding-bottom: 44px !important; }

  .xs-m-l-44 {
    margin-left: 44px !important; }

  .xs-p-l-44 {
    padding-left: 44px !important; }

  .xs-m-r-44 {
    margin-right: 44px !important; }

  .xs-p-r-44 {
    padding-right: 44px !important; }

  .xs-m-44 {
    margin: 44px !important; }

  .xs-p-44 {
    padding: 44px !important; }

  .xs-m-t-46 {
    margin-top: 46px !important; }

  .xs-p-t-46 {
    padding-top: 46px !important; }

  .xs-m-b-46 {
    margin-bottom: 46px !important; }

  .xs-p-b-46 {
    padding-bottom: 46px !important; }

  .xs-m-l-46 {
    margin-left: 46px !important; }

  .xs-p-l-46 {
    padding-left: 46px !important; }

  .xs-m-r-46 {
    margin-right: 46px !important; }

  .xs-p-r-46 {
    padding-right: 46px !important; }

  .xs-m-46 {
    margin: 46px !important; }

  .xs-p-46 {
    padding: 46px !important; }

  .xs-m-t-48 {
    margin-top: 48px !important; }

  .xs-p-t-48 {
    padding-top: 48px !important; }

  .xs-m-b-48 {
    margin-bottom: 48px !important; }

  .xs-p-b-48 {
    padding-bottom: 48px !important; }

  .xs-m-l-48 {
    margin-left: 48px !important; }

  .xs-p-l-48 {
    padding-left: 48px !important; }

  .xs-m-r-48 {
    margin-right: 48px !important; }

  .xs-p-r-48 {
    padding-right: 48px !important; }

  .xs-m-48 {
    margin: 48px !important; }

  .xs-p-48 {
    padding: 48px !important; }

  .xs-m-t-50 {
    margin-top: 50px !important; }

  .xs-p-t-50 {
    padding-top: 50px !important; }

  .xs-m-b-50 {
    margin-bottom: 50px !important; }

  .xs-p-b-50 {
    padding-bottom: 50px !important; }

  .xs-m-l-50 {
    margin-left: 50px !important; }

  .xs-p-l-50 {
    padding-left: 50px !important; }

  .xs-m-r-50 {
    margin-right: 50px !important; }

  .xs-p-r-50 {
    padding-right: 50px !important; }

  .xs-m-50 {
    margin: 50px !important; }

  .xs-p-50 {
    padding: 50px !important; }

  .xs-m-t-52 {
    margin-top: 52px !important; }

  .xs-p-t-52 {
    padding-top: 52px !important; }

  .xs-m-b-52 {
    margin-bottom: 52px !important; }

  .xs-p-b-52 {
    padding-bottom: 52px !important; }

  .xs-m-l-52 {
    margin-left: 52px !important; }

  .xs-p-l-52 {
    padding-left: 52px !important; }

  .xs-m-r-52 {
    margin-right: 52px !important; }

  .xs-p-r-52 {
    padding-right: 52px !important; }

  .xs-m-52 {
    margin: 52px !important; }

  .xs-p-52 {
    padding: 52px !important; }

  .xs-m-t-54 {
    margin-top: 54px !important; }

  .xs-p-t-54 {
    padding-top: 54px !important; }

  .xs-m-b-54 {
    margin-bottom: 54px !important; }

  .xs-p-b-54 {
    padding-bottom: 54px !important; }

  .xs-m-l-54 {
    margin-left: 54px !important; }

  .xs-p-l-54 {
    padding-left: 54px !important; }

  .xs-m-r-54 {
    margin-right: 54px !important; }

  .xs-p-r-54 {
    padding-right: 54px !important; }

  .xs-m-54 {
    margin: 54px !important; }

  .xs-p-54 {
    padding: 54px !important; }

  .xs-m-t-56 {
    margin-top: 56px !important; }

  .xs-p-t-56 {
    padding-top: 56px !important; }

  .xs-m-b-56 {
    margin-bottom: 56px !important; }

  .xs-p-b-56 {
    padding-bottom: 56px !important; }

  .xs-m-l-56 {
    margin-left: 56px !important; }

  .xs-p-l-56 {
    padding-left: 56px !important; }

  .xs-m-r-56 {
    margin-right: 56px !important; }

  .xs-p-r-56 {
    padding-right: 56px !important; }

  .xs-m-56 {
    margin: 56px !important; }

  .xs-p-56 {
    padding: 56px !important; }

  .xs-m-t-58 {
    margin-top: 58px !important; }

  .xs-p-t-58 {
    padding-top: 58px !important; }

  .xs-m-b-58 {
    margin-bottom: 58px !important; }

  .xs-p-b-58 {
    padding-bottom: 58px !important; }

  .xs-m-l-58 {
    margin-left: 58px !important; }

  .xs-p-l-58 {
    padding-left: 58px !important; }

  .xs-m-r-58 {
    margin-right: 58px !important; }

  .xs-p-r-58 {
    padding-right: 58px !important; }

  .xs-m-58 {
    margin: 58px !important; }

  .xs-p-58 {
    padding: 58px !important; }

  .xs-m-t-59 {
    margin-top: 59px !important; }

  .xs-p-t-59 {
    padding-top: 59px !important; }

  .xs-m-b-59 {
    margin-bottom: 59px !important; }

  .xs-p-b-59 {
    padding-bottom: 59px !important; }

  .xs-m-l-59 {
    margin-left: 59px !important; }

  .xs-p-l-59 {
    padding-left: 59px !important; }

  .xs-m-r-59 {
    margin-right: 59px !important; }

  .xs-p-r-59 {
    padding-right: 59px !important; }

  .xs-m-59 {
    margin: 59px !important; }

  .xs-p-59 {
    padding: 59px !important; }

  .xs-m-t-60 {
    margin-top: 60px !important; }

  .xs-p-t-60 {
    padding-top: 60px !important; }

  .xs-m-b-60 {
    margin-bottom: 60px !important; }

  .xs-p-b-60 {
    padding-bottom: 60px !important; }

  .xs-m-l-60 {
    margin-left: 60px !important; }

  .xs-p-l-60 {
    padding-left: 60px !important; }

  .xs-m-r-60 {
    margin-right: 60px !important; }

  .xs-p-r-60 {
    padding-right: 60px !important; }

  .xs-m-60 {
    margin: 60px !important; }

  .xs-p-60 {
    padding: 60px !important; }

  .xs-m-t-62 {
    margin-top: 62px !important; }

  .xs-p-t-62 {
    padding-top: 62px !important; }

  .xs-m-b-62 {
    margin-bottom: 62px !important; }

  .xs-p-b-62 {
    padding-bottom: 62px !important; }

  .xs-m-l-62 {
    margin-left: 62px !important; }

  .xs-p-l-62 {
    padding-left: 62px !important; }

  .xs-m-r-62 {
    margin-right: 62px !important; }

  .xs-p-r-62 {
    padding-right: 62px !important; }

  .xs-m-62 {
    margin: 62px !important; }

  .xs-p-62 {
    padding: 62px !important; }

  .xs-m-t-64 {
    margin-top: 64px !important; }

  .xs-p-t-64 {
    padding-top: 64px !important; }

  .xs-m-b-64 {
    margin-bottom: 64px !important; }

  .xs-p-b-64 {
    padding-bottom: 64px !important; }

  .xs-m-l-64 {
    margin-left: 64px !important; }

  .xs-p-l-64 {
    padding-left: 64px !important; }

  .xs-m-r-64 {
    margin-right: 64px !important; }

  .xs-p-r-64 {
    padding-right: 64px !important; }

  .xs-m-64 {
    margin: 64px !important; }

  .xs-p-64 {
    padding: 64px !important; }

  .xs-m-t-66 {
    margin-top: 66px !important; }

  .xs-p-t-66 {
    padding-top: 66px !important; }

  .xs-m-b-66 {
    margin-bottom: 66px !important; }

  .xs-p-b-66 {
    padding-bottom: 66px !important; }

  .xs-m-l-66 {
    margin-left: 66px !important; }

  .xs-p-l-66 {
    padding-left: 66px !important; }

  .xs-m-r-66 {
    margin-right: 66px !important; }

  .xs-p-r-66 {
    padding-right: 66px !important; }

  .xs-m-66 {
    margin: 66px !important; }

  .xs-p-66 {
    padding: 66px !important; }

  .xs-m-t-68 {
    margin-top: 68px !important; }

  .xs-p-t-68 {
    padding-top: 68px !important; }

  .xs-m-b-68 {
    margin-bottom: 68px !important; }

  .xs-p-b-68 {
    padding-bottom: 68px !important; }

  .xs-m-l-68 {
    margin-left: 68px !important; }

  .xs-p-l-68 {
    padding-left: 68px !important; }

  .xs-m-r-68 {
    margin-right: 68px !important; }

  .xs-p-r-68 {
    padding-right: 68px !important; }

  .xs-m-68 {
    margin: 68px !important; }

  .xs-p-68 {
    padding: 68px !important; }

  .xs-m-t-70 {
    margin-top: 70px !important; }

  .xs-p-t-70 {
    padding-top: 70px !important; }

  .xs-m-b-70 {
    margin-bottom: 70px !important; }

  .xs-p-b-70 {
    padding-bottom: 70px !important; }

  .xs-m-l-70 {
    margin-left: 70px !important; }

  .xs-p-l-70 {
    padding-left: 70px !important; }

  .xs-m-r-70 {
    margin-right: 70px !important; }

  .xs-p-r-70 {
    padding-right: 70px !important; }

  .xs-m-70 {
    margin: 70px !important; }

  .xs-p-70 {
    padding: 70px !important; }

  .xs-m-t-72 {
    margin-top: 72px !important; }

  .xs-p-t-72 {
    padding-top: 72px !important; }

  .xs-m-b-72 {
    margin-bottom: 72px !important; }

  .xs-p-b-72 {
    padding-bottom: 72px !important; }

  .xs-m-l-72 {
    margin-left: 72px !important; }

  .xs-p-l-72 {
    padding-left: 72px !important; }

  .xs-m-r-72 {
    margin-right: 72px !important; }

  .xs-p-r-72 {
    padding-right: 72px !important; }

  .xs-m-72 {
    margin: 72px !important; }

  .xs-p-72 {
    padding: 72px !important; }

  .xs-m-t-74 {
    margin-top: 74px !important; }

  .xs-p-t-74 {
    padding-top: 74px !important; }

  .xs-m-b-74 {
    margin-bottom: 74px !important; }

  .xs-p-b-74 {
    padding-bottom: 74px !important; }

  .xs-m-l-74 {
    margin-left: 74px !important; }

  .xs-p-l-74 {
    padding-left: 74px !important; }

  .xs-m-r-74 {
    margin-right: 74px !important; }

  .xs-p-r-74 {
    padding-right: 74px !important; }

  .xs-m-74 {
    margin: 74px !important; }

  .xs-p-74 {
    padding: 74px !important; }

  .xs-m-t-76 {
    margin-top: 76px !important; }

  .xs-p-t-76 {
    padding-top: 76px !important; }

  .xs-m-b-76 {
    margin-bottom: 76px !important; }

  .xs-p-b-76 {
    padding-bottom: 76px !important; }

  .xs-m-l-76 {
    margin-left: 76px !important; }

  .xs-p-l-76 {
    padding-left: 76px !important; }

  .xs-m-r-76 {
    margin-right: 76px !important; }

  .xs-p-r-76 {
    padding-right: 76px !important; }

  .xs-m-76 {
    margin: 76px !important; }

  .xs-p-76 {
    padding: 76px !important; }

  .xs-m-t-78 {
    margin-top: 78px !important; }

  .xs-p-t-78 {
    padding-top: 78px !important; }

  .xs-m-b-78 {
    margin-bottom: 78px !important; }

  .xs-p-b-78 {
    padding-bottom: 78px !important; }

  .xs-m-l-78 {
    margin-left: 78px !important; }

  .xs-p-l-78 {
    padding-left: 78px !important; }

  .xs-m-r-78 {
    margin-right: 78px !important; }

  .xs-p-r-78 {
    padding-right: 78px !important; }

  .xs-m-78 {
    margin: 78px !important; }

  .xs-p-78 {
    padding: 78px !important; }

  .xs-m-t-80 {
    margin-top: 80px !important; }

  .xs-p-t-80 {
    padding-top: 80px !important; }

  .xs-m-b-80 {
    margin-bottom: 80px !important; }

  .xs-p-b-80 {
    padding-bottom: 80px !important; }

  .xs-m-l-80 {
    margin-left: 80px !important; }

  .xs-p-l-80 {
    padding-left: 80px !important; }

  .xs-m-r-80 {
    margin-right: 80px !important; }

  .xs-p-r-80 {
    padding-right: 80px !important; }

  .xs-m-80 {
    margin: 80px !important; }

  .xs-p-80 {
    padding: 80px !important; }

  .xs-m-t-82 {
    margin-top: 82px !important; }

  .xs-p-t-82 {
    padding-top: 82px !important; }

  .xs-m-b-82 {
    margin-bottom: 82px !important; }

  .xs-p-b-82 {
    padding-bottom: 82px !important; }

  .xs-m-l-82 {
    margin-left: 82px !important; }

  .xs-p-l-82 {
    padding-left: 82px !important; }

  .xs-m-r-82 {
    margin-right: 82px !important; }

  .xs-p-r-82 {
    padding-right: 82px !important; }

  .xs-m-82 {
    margin: 82px !important; }

  .xs-p-82 {
    padding: 82px !important; }

  .xs-m-t-84 {
    margin-top: 84px !important; }

  .xs-p-t-84 {
    padding-top: 84px !important; }

  .xs-m-b-84 {
    margin-bottom: 84px !important; }

  .xs-p-b-84 {
    padding-bottom: 84px !important; }

  .xs-m-l-84 {
    margin-left: 84px !important; }

  .xs-p-l-84 {
    padding-left: 84px !important; }

  .xs-m-r-84 {
    margin-right: 84px !important; }

  .xs-p-r-84 {
    padding-right: 84px !important; }

  .xs-m-84 {
    margin: 84px !important; }

  .xs-p-84 {
    padding: 84px !important; }

  .xs-m-t-86 {
    margin-top: 86px !important; }

  .xs-p-t-86 {
    padding-top: 86px !important; }

  .xs-m-b-86 {
    margin-bottom: 86px !important; }

  .xs-p-b-86 {
    padding-bottom: 86px !important; }

  .xs-m-l-86 {
    margin-left: 86px !important; }

  .xs-p-l-86 {
    padding-left: 86px !important; }

  .xs-m-r-86 {
    margin-right: 86px !important; }

  .xs-p-r-86 {
    padding-right: 86px !important; }

  .xs-m-86 {
    margin: 86px !important; }

  .xs-p-86 {
    padding: 86px !important; }

  .xs-m-t-88 {
    margin-top: 88px !important; }

  .xs-p-t-88 {
    padding-top: 88px !important; }

  .xs-m-b-88 {
    margin-bottom: 88px !important; }

  .xs-p-b-88 {
    padding-bottom: 88px !important; }

  .xs-m-l-88 {
    margin-left: 88px !important; }

  .xs-p-l-88 {
    padding-left: 88px !important; }

  .xs-m-r-88 {
    margin-right: 88px !important; }

  .xs-p-r-88 {
    padding-right: 88px !important; }

  .xs-m-88 {
    margin: 88px !important; }

  .xs-p-88 {
    padding: 88px !important; }

  .xs-m-t-90 {
    margin-top: 90px !important; }

  .xs-p-t-90 {
    padding-top: 90px !important; }

  .xs-m-b-90 {
    margin-bottom: 90px !important; }

  .xs-p-b-90 {
    padding-bottom: 90px !important; }

  .xs-m-l-90 {
    margin-left: 90px !important; }

  .xs-p-l-90 {
    padding-left: 90px !important; }

  .xs-m-r-90 {
    margin-right: 90px !important; }

  .xs-p-r-90 {
    padding-right: 90px !important; }

  .xs-m-90 {
    margin: 90px !important; }

  .xs-p-90 {
    padding: 90px !important; }

  .xs-m-t-92 {
    margin-top: 92px !important; }

  .xs-p-t-92 {
    padding-top: 92px !important; }

  .xs-m-b-92 {
    margin-bottom: 92px !important; }

  .xs-p-b-92 {
    padding-bottom: 92px !important; }

  .xs-m-l-92 {
    margin-left: 92px !important; }

  .xs-p-l-92 {
    padding-left: 92px !important; }

  .xs-m-r-92 {
    margin-right: 92px !important; }

  .xs-p-r-92 {
    padding-right: 92px !important; }

  .xs-m-92 {
    margin: 92px !important; }

  .xs-p-92 {
    padding: 92px !important; }

  .xs-m-t-94 {
    margin-top: 94px !important; }

  .xs-p-t-94 {
    padding-top: 94px !important; }

  .xs-m-b-94 {
    margin-bottom: 94px !important; }

  .xs-p-b-94 {
    padding-bottom: 94px !important; }

  .xs-m-l-94 {
    margin-left: 94px !important; }

  .xs-p-l-94 {
    padding-left: 94px !important; }

  .xs-m-r-94 {
    margin-right: 94px !important; }

  .xs-p-r-94 {
    padding-right: 94px !important; }

  .xs-m-94 {
    margin: 94px !important; }

  .xs-p-94 {
    padding: 94px !important; }

  .xs-m-t-96 {
    margin-top: 96px !important; }

  .xs-p-t-96 {
    padding-top: 96px !important; }

  .xs-m-b-96 {
    margin-bottom: 96px !important; }

  .xs-p-b-96 {
    padding-bottom: 96px !important; }

  .xs-m-l-96 {
    margin-left: 96px !important; }

  .xs-p-l-96 {
    padding-left: 96px !important; }

  .xs-m-r-96 {
    margin-right: 96px !important; }

  .xs-p-r-96 {
    padding-right: 96px !important; }

  .xs-m-96 {
    margin: 96px !important; }

  .xs-p-96 {
    padding: 96px !important; }

  .xs-m-t-98 {
    margin-top: 98px !important; }

  .xs-p-t-98 {
    padding-top: 98px !important; }

  .xs-m-b-98 {
    margin-bottom: 98px !important; }

  .xs-p-b-98 {
    padding-bottom: 98px !important; }

  .xs-m-l-98 {
    margin-left: 98px !important; }

  .xs-p-l-98 {
    padding-left: 98px !important; }

  .xs-m-r-98 {
    margin-right: 98px !important; }

  .xs-p-r-98 {
    padding-right: 98px !important; }

  .xs-m-98 {
    margin: 98px !important; }

  .xs-p-98 {
    padding: 98px !important; }

  .xs-m-t-100 {
    margin-top: 100px !important; }

  .xs-p-t-100 {
    padding-top: 100px !important; }

  .xs-m-b-100 {
    margin-bottom: 100px !important; }

  .xs-p-b-100 {
    padding-bottom: 100px !important; }

  .xs-m-l-100 {
    margin-left: 100px !important; }

  .xs-p-l-100 {
    padding-left: 100px !important; }

  .xs-m-r-100 {
    margin-right: 100px !important; }

  .xs-p-r-100 {
    padding-right: 100px !important; }

  .xs-m-100 {
    margin: 100px !important; }

  .xs-p-100 {
    padding: 100px !important; }

  .xs-m-t-104 {
    margin-top: 104px !important; }

  .xs-p-t-104 {
    padding-top: 104px !important; }

  .xs-m-b-104 {
    margin-bottom: 104px !important; }

  .xs-p-b-104 {
    padding-bottom: 104px !important; }

  .xs-m-l-104 {
    margin-left: 104px !important; }

  .xs-p-l-104 {
    padding-left: 104px !important; }

  .xs-m-r-104 {
    margin-right: 104px !important; }

  .xs-p-r-104 {
    padding-right: 104px !important; }

  .xs-m-104 {
    margin: 104px !important; }

  .xs-p-104 {
    padding: 104px !important; }

  .xs-m-t-108 {
    margin-top: 108px !important; }

  .xs-p-t-108 {
    padding-top: 108px !important; }

  .xs-m-b-108 {
    margin-bottom: 108px !important; }

  .xs-p-b-108 {
    padding-bottom: 108px !important; }

  .xs-m-l-108 {
    margin-left: 108px !important; }

  .xs-p-l-108 {
    padding-left: 108px !important; }

  .xs-m-r-108 {
    margin-right: 108px !important; }

  .xs-p-r-108 {
    padding-right: 108px !important; }

  .xs-m-108 {
    margin: 108px !important; }

  .xs-p-108 {
    padding: 108px !important; }

  .xs-m-t-110 {
    margin-top: 110px !important; }

  .xs-p-t-110 {
    padding-top: 110px !important; }

  .xs-m-b-110 {
    margin-bottom: 110px !important; }

  .xs-p-b-110 {
    padding-bottom: 110px !important; }

  .xs-m-l-110 {
    margin-left: 110px !important; }

  .xs-p-l-110 {
    padding-left: 110px !important; }

  .xs-m-r-110 {
    margin-right: 110px !important; }

  .xs-p-r-110 {
    padding-right: 110px !important; }

  .xs-m-110 {
    margin: 110px !important; }

  .xs-p-110 {
    padding: 110px !important; }

  .xs-m-t-112 {
    margin-top: 112px !important; }

  .xs-p-t-112 {
    padding-top: 112px !important; }

  .xs-m-b-112 {
    margin-bottom: 112px !important; }

  .xs-p-b-112 {
    padding-bottom: 112px !important; }

  .xs-m-l-112 {
    margin-left: 112px !important; }

  .xs-p-l-112 {
    padding-left: 112px !important; }

  .xs-m-r-112 {
    margin-right: 112px !important; }

  .xs-p-r-112 {
    padding-right: 112px !important; }

  .xs-m-112 {
    margin: 112px !important; }

  .xs-p-112 {
    padding: 112px !important; }

  .xs-m-t-114 {
    margin-top: 114px !important; }

  .xs-p-t-114 {
    padding-top: 114px !important; }

  .xs-m-b-114 {
    margin-bottom: 114px !important; }

  .xs-p-b-114 {
    padding-bottom: 114px !important; }

  .xs-m-l-114 {
    margin-left: 114px !important; }

  .xs-p-l-114 {
    padding-left: 114px !important; }

  .xs-m-r-114 {
    margin-right: 114px !important; }

  .xs-p-r-114 {
    padding-right: 114px !important; }

  .xs-m-114 {
    margin: 114px !important; }

  .xs-p-114 {
    padding: 114px !important; }

  .xs-m-t-116 {
    margin-top: 116px !important; }

  .xs-p-t-116 {
    padding-top: 116px !important; }

  .xs-m-b-116 {
    margin-bottom: 116px !important; }

  .xs-p-b-116 {
    padding-bottom: 116px !important; }

  .xs-m-l-116 {
    margin-left: 116px !important; }

  .xs-p-l-116 {
    padding-left: 116px !important; }

  .xs-m-r-116 {
    margin-right: 116px !important; }

  .xs-p-r-116 {
    padding-right: 116px !important; }

  .xs-m-116 {
    margin: 116px !important; }

  .xs-p-116 {
    padding: 116px !important; }

  .xs-m-t-118 {
    margin-top: 118px !important; }

  .xs-p-t-118 {
    padding-top: 118px !important; }

  .xs-m-b-118 {
    margin-bottom: 118px !important; }

  .xs-p-b-118 {
    padding-bottom: 118px !important; }

  .xs-m-l-118 {
    margin-left: 118px !important; }

  .xs-p-l-118 {
    padding-left: 118px !important; }

  .xs-m-r-118 {
    margin-right: 118px !important; }

  .xs-p-r-118 {
    padding-right: 118px !important; }

  .xs-m-118 {
    margin: 118px !important; }

  .xs-p-118 {
    padding: 118px !important; }

  .xs-m-t-120 {
    margin-top: 120px !important; }

  .xs-p-t-120 {
    padding-top: 120px !important; }

  .xs-m-b-120 {
    margin-bottom: 120px !important; }

  .xs-p-b-120 {
    padding-bottom: 120px !important; }

  .xs-m-l-120 {
    margin-left: 120px !important; }

  .xs-p-l-120 {
    padding-left: 120px !important; }

  .xs-m-r-120 {
    margin-right: 120px !important; }

  .xs-p-r-120 {
    padding-right: 120px !important; }

  .xs-m-120 {
    margin: 120px !important; }

  .xs-p-120 {
    padding: 120px !important; }

  .xs-m-t-122 {
    margin-top: 122px !important; }

  .xs-p-t-122 {
    padding-top: 122px !important; }

  .xs-m-b-122 {
    margin-bottom: 122px !important; }

  .xs-p-b-122 {
    padding-bottom: 122px !important; }

  .xs-m-l-122 {
    margin-left: 122px !important; }

  .xs-p-l-122 {
    padding-left: 122px !important; }

  .xs-m-r-122 {
    margin-right: 122px !important; }

  .xs-p-r-122 {
    padding-right: 122px !important; }

  .xs-m-122 {
    margin: 122px !important; }

  .xs-p-122 {
    padding: 122px !important; }

  .xs-m-t-124 {
    margin-top: 124px !important; }

  .xs-p-t-124 {
    padding-top: 124px !important; }

  .xs-m-b-124 {
    margin-bottom: 124px !important; }

  .xs-p-b-124 {
    padding-bottom: 124px !important; }

  .xs-m-l-124 {
    margin-left: 124px !important; }

  .xs-p-l-124 {
    padding-left: 124px !important; }

  .xs-m-r-124 {
    margin-right: 124px !important; }

  .xs-p-r-124 {
    padding-right: 124px !important; }

  .xs-m-124 {
    margin: 124px !important; }

  .xs-p-124 {
    padding: 124px !important; } }
.login-wrapper .left-side, .login-wrapper .left-side-wrapper, .login-wrapper .right-side, .login-wrapper .right-side-wrapper form .password-wrapper, .navigation-wrapper .pannel-wrapper, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items li a, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper ul, .overview-wrapper .content-wrapper, .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper, .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper, .project-resources-wrapper .content-wrapper, .user-tracking-wrapper .content-wrapper, .inventory-wrapper .content-wrapper, .inventory-calendar-wrapper .activity .content-wrapper, .work-order-wrapper .content-wrapper, .main-calendar .dates-wrapper .cal-date .date-top {
  position: relative; }

.white-bg, .login-wrapper .left-side .black-gradient, .login-wrapper .right-side-wrapper form .password-wrapper .eye-icon, .login-wrapper .right-side .pat-top, .login-wrapper .right-side .pat-bottom, .navigation-wrapper .nav-devices-details, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items li a svg, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page, .overview-wrapper .content-wrapper .white-bg, .contract-wrapper .detail-wrapper .content-wrapper #one .lft .contract-parameters .white-bg, .main-calendar .dates-wrapper .cal-date .date-top h2 {
  position: absolute; }

.nav-devices-details .close-cta, .top-nav-wrapper, .login-wrapper .force-login-wrapper, .navigation-wrapper, .navigation-wrapper .mob-navigation-wrapper .header {
  position: fixed; }

.nav-devices-details .device-name-wrapper, .nav-devices-details .options .options-data ul li a, .nav-devices-details .options .options-data ul.icon-list li, .nav-devices-details .close-cta ul li a, .top-nav-wrapper .top-nav-container, .top-nav-wrapper .top-nav-container .project-name, .top-nav-wrapper .top-nav-container .right-controls, .top-nav-wrapper .top-nav-container .right-controls .lang, .overview-card, .overview-card .icon, .cards-wrapper .cards-slider, .long-card-wrapper .top-head, .long-card-wrapper .top-head .calendar-wrap, .long-card-wrapper .detail-wrapper .detail, .long-card-wrapper .more-option, .long-card-wrapper .more-option p, .graph-wrapper .value-head, .graph-wrapper .value-head .calendar-wrap, .multiple-button-wrapper, .multiple-button-wrapper button, button.primary-tab, .login-wrapper, .login-wrapper .force-login-wrapper, .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content .options, .navigation-wrapper .mob-navigation-wrapper .header, .navigation-wrapper .mob-navigation-wrapper .header a, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a > div, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items li a, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-head, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-head .device-name, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper ul li a, .overview-wrapper .select-options, .alarms-wrapper .data-togglers, .alarms-wrapper .data-togglers .date-plus-time, .alarms-wrapper .data-togglers .date-plus-time > div, .monitor-cb-detail-wrapper .top-controls, .monitor-cb-detail-wrapper .top-controls .dual-options, .monitor-cb-detail-wrapper .content-section-wrapper, .monitor-cb-detail-wrapper .content-section-wrapper .right-wrapper, .inverter-detail-wrapper .top-controls, .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data .data-item, .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option, .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option p, .inverter-details .top-controls, .inverter-details .top-controls .dual-options, .inverter-details .content-section-wrapper .middle-container, .mfm-wrapper .top-controls, .ws-wrapper .top-controls, .contract-wrapper .top-input, .contract-wrapper .detail-wrapper .tabs-wrapper, .contract-wrapper .detail-wrapper .tabs-wrapper .action-buttons, .contract-wrapper .detail-wrapper .content-wrapper #one, .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items, .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items .action-buttons, .project-resources-wrapper .top-head, .project-resources-wrapper .top-head .action-buttons, .user-tracking-wrapper .top-head .input-section, .user-tracking-wrapper .top-head .input-section .date-wrapper, .inventory-wrapper .top-head, .inventory-wrapper .top-head .action-buttons, .inventory-calendar-wrapper, .inventory-calendar-wrapper .activity .head, .inventory-calendar-wrapper .activity .detail-wrapper, .inventory-calendar-wrapper .activity .detail-wrapper .action-buttons, .inventory-calendar-wrapper .activity .save-wrapper, .work-order-wrapper, .work-order-wrapper .right-wrapper .work-order-popup .heading, .work-order-wrapper .right-wrapper .work-order-popup .details .details-data, .work-order-wrapper .top-head, .work-order-wrapper .top-head .action-buttons, .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel, .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps, .work-order-wrapper .search-wrapper .search-content .heading, .work-order-wrapper .search-wrapper .search-content form .action-buttons, .main-calendar .head-wrapper, .main-calendar .dates-wrapper, .main-calendar .dates-wrapper .cal-date .date-top, .main-calendar .dates-wrapper .cal-date .cal-details, #week-view.main-calendar .dates-wrapper .cal-date, #day-view.main-calendar, #month-view.main-calendar .dates-wrapper .cal-date, .work-order-details .heading, .work-order-details .heading .actions-buttons, .work-order-details .switch-tab, .work-order-details .content-wrapper, .work-order-details .content-wrapper .details form .liked-work-orders, .work-order-details .content-wrapper .preview .action-tabs, .work-order-inverter .content-wrapper .cards-details, .vendors-details .content-wrapper .preview .preview-content-wrapper, .vendors-details .content-wrapper .preview .preview-content-wrapper .Cleaners-cards .actions-box, .vendors-details .content-wrapper .preview .add-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row; }

.input-wrapper, .nav-devices-details, .nav-devices-details .options, .nav-devices-details .options .options-data, .overview-card .card-name, .long-card-wrapper, .long-card-wrapper .detail-wrapper, .graph-wrapper, .login-wrapper .left-side-wrapper, .login-wrapper .right-side, .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content, .navigation-wrapper .pannel-wrapper, .navigation-wrapper .pannel-wrapper .top, .navigation-wrapper .pannel-wrapper .top .devices-wrapper, .navigation-wrapper .pannel-wrapper .bottom, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page, .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper, .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details, .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data, .inverter-details .content-section-wrapper, .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper, #day-view.main-calendar .time, #day-view.main-calendar .dates-wrapper, #day-view.main-calendar .dates-wrapper .cal-date, #month-view.main-calendar .dates-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content, .contract-wrapper .detail-wrapper .content-wrapper #one .lft .date-wrapper {
  display: grid; }

@font-face {
  font-family: 'Sans-Bold';
  src: url(../../build/fonts/sans/ibmplexsans-bold-webfont.woff2) format("woff2"), url(../../build/fonts/sans/ibmplexsans-bold-webfont.woff) format("woff"); }
@font-face {
  font-family: 'Sans-Medium';
  src: url(../../build/fonts/sans/ibmplexsans-medium-webfont.woff2) format("woff2"), url(../../build/fonts/sans/ibmplexsans-medium-webfont.woff) format("woff"); }
@font-face {
  font-family: 'Sans-Regular';
  src: url(../../build/fonts/sans/ibmplexsans-regular-webfont.woff2) format("woff2"), url(../../build/fonts/sans/ibmplexsans-regular-webfont.woff) format("woff"); }
@font-face {
  font-family: 'Sans-SemiBold';
  src: url(../../build/fonts/sans/ibmplexsans-semibold-webfont.woff2) format("woff2"), url(../../build/fonts/sans/ibmplexsans-semibold-webfont.woff) format("woff"); }
@font-face {
  font-family: 'Mono-Regular';
  src: url(../../build/fonts/mono/ibmplexmono-regular-webfont.woff2) format("woff2"), url(../../build/fonts/mono/ibmplexmono-regular-webfont.woff) format("woff"); }
@font-face {
  font-family: 'Mono-SemiBold';
  src: url(../../build/fonts/mono/ibmplexmono-semibold-webfont.woff2) format("woff2"), url(../../build/fonts/mono/ibmplexmono-semibold-webfont.woff) format("woff"); }
h1 {
  font-family: 'Sans-SemiBold';
  font-size: 24px;
  line-height: 32px;
  font-weight: inherit; }
  @media (max-width: 767px) {
    h1 {
      font-size: 20px; } }

h2 {
  font-family: 'Sans-Bold';
  font-size: 20px;
  line-height: 32px;
  font-weight: inherit; }
  @media (max-width: 767px) {
    h2 {
      font-size: 18px; } }

h3 {
  font-family: 'Sans-Bold';
  font-size: 18px;
  line-height: 24px;
  font-weight: inherit; }
  @media (max-width: 767px) {
    h3 {
      font-size: 16px; } }

h4 {
  font-family: 'Sans-Bold';
  font-size: 16px;
  line-height: 24px;
  font-weight: inherit; }
  @media (max-width: 767px) {
    h4 {
      font-size: 14px; } }

.txt-reg {
  font-family: 'Sans-Regular' !important; }

.txt-med {
  font-family: 'Sans-Medium' !important; }

.txt-14 {
  font-family: 'Sans-Bold';
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.28px; }
  @media (max-width: 767px) {
    .txt-14 {
      font-size: 12px;
      line-height: 16px; } }

.txt-12 {
  font-family: 'Sans-Bold';
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.28px; }

.ls-0 {
  letter-spacing: 0.56px; }

.ls-1 {
  letter-spacing: 1.40px; }

.txt-20-mono {
  font-family: 'Mono-SemiBold';
  line-height: 16px;
  font-size: 20px; }
  @media (max-width: 767px) {
    .txt-20-mono {
      font-size: 16px;
      line-height: 24px; } }

.txt-12-mono {
  font-family: 'Mono-Regular';
  font-size: 12px;
  line-height: 16px; }

.input-wrapper {
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  width: 100%;
  position: relative; }
  .input-wrapper label {
    color: #272838; }
  .input-wrapper input, .input-wrapper textarea {
    width: 100%;
    border: 1px solid rgba(48, 72, 80, 0.4);
    border-style: inset;
    box-sizing: border-box;
    border-radius: 8px;
    color: #272838;
    padding: 11px 16px;
    background-color: #FFFFFF; }
    .input-wrapper input:-ms-input-placeholder, .input-wrapper textarea:-ms-input-placeholder {
      color: rgba(48, 72, 80, 0.4); }
    .input-wrapper input::placeholder, .input-wrapper textarea::placeholder {
      color: rgba(48, 72, 80, 0.4); }
    .input-wrapper input:focus, .input-wrapper textarea:focus {
      background-color: rgba(48, 72, 80, 0.05); }
  .input-wrapper .search-icon {
    position: absolute;
    top: 44px;
    right: 16px; }
    @media (max-width: 767px) {
      .input-wrapper .search-icon {
        top: 33px; } }
  .input-wrapper input.search-input {
    padding-right: 40px; }
  .input-wrapper span {
    color: rgba(48, 72, 80, 0.6);
    display: none; }
  .input-wrapper span.valid {
    color: #F4A021; }
  .input-wrapper span.invalid {
    color: #FF6464; }

.double-input {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 16px;
  position: relative; }

.nav-devices-details {
  background-color: #272838;
  padding: 16px;
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  width: 232px;
  height: 100%;
  -ms-transform: translate(-100%);
      transform: translate(-100%);
  transition: all 0.3s; }
  .nav-devices-details .device-name-wrapper {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center;
    border-bottom: 0.2px solid #FFFFFF;
    width: 100%; }
    .nav-devices-details .device-name-wrapper svg {
      width: 24px;
      height: 24px;
      margin-right: 4px; }
      .nav-devices-details .device-name-wrapper svg path {
        fill: #FFFFFF; }
    .nav-devices-details .device-name-wrapper h4 {
      color: #FFFFFF;
      text-transform: uppercase; }
  .nav-devices-details .options {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: start;
        align-items: flex-start;
    width: 100%; }
    .nav-devices-details .options .options-data {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
      width: 100%; }
      .nav-devices-details .options .options-data .options-head {
        color: rgba(255, 255, 255, 0.4);
        text-transform: uppercase;
        margin-top: 16px; }
      .nav-devices-details .options .options-data ul {
        padding-left: 8px;
        width: 100%; }
        .nav-devices-details .options .options-data ul li {
          display: block;
          list-style: none;
          margin-top: 16px; }
          .nav-devices-details .options .options-data ul li a {
            color: #FFFFFF;
            text-decoration: none;
            -ms-flex-pack: justify;
                justify-content: space-between;
            -ms-flex-align: center;
                align-items: center;
            text-transform: uppercase; }
            .nav-devices-details .options .options-data ul li a svg {
              opacity: 0;
              transition: all 0.3s;
              width: 20px;
              height: 20px; }
            .nav-devices-details .options .options-data ul li a:hover {
              color: #5ED7FB; }
              .nav-devices-details .options .options-data ul li a:hover svg {
                opacity: 1; }
                .nav-devices-details .options .options-data ul li a:hover svg path {
                  fill: #5ED7FB; }
          .nav-devices-details .options .options-data ul li .pill {
            color: #FFFFFF;
            background-color: #165FFA;
            padding: 0 4px;
            border-radius: 4px; }
      .nav-devices-details .options .options-data ul.icon-list {
        padding-left: 0; }
        .nav-devices-details .options .options-data ul.icon-list li {
          -ms-flex-pack: start;
              justify-content: flex-start;
          -ms-flex-align: center;
              align-items: center; }
          .nav-devices-details .options .options-data ul.icon-list li > svg {
            max-width: 24px;
            height: 24px;
            width: 100%;
            min-width: 24px; }
          .nav-devices-details .options .options-data ul.icon-list li a {
            margin-left: 16px;
            width: 100%;
            -ms-flex-pack: justify;
                justify-content: space-between; }
  .nav-devices-details .close-cta {
    width: 100%;
    bottom: 0px;
    left: 0px;
    padding: 16px;
    background-color: #272838; }
    .nav-devices-details .close-cta ul li a {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: center;
          align-items: center;
      color: #FFFFFF;
      text-transform: uppercase; }
      .nav-devices-details .close-cta ul li a svg {
        width: 16px;
        height: 16px;
        margin-right: 16px; }
        .nav-devices-details .close-cta ul li a svg path {
          fill: #FFFFFF; }

.open-details {
  -ms-transform: translate(0);
      transform: translate(0); }

.top-nav-wrapper {
  top: 0;
  right: 0;
  width: calc(100% - 64px);
  max-height: 56px;
  height: 100%;
  background-color: #008FF6;
  padding: 15px 24px 17px 24px;
  z-index: 999; }
  @media (max-width: 767px) {
    .top-nav-wrapper {
      width: 100%;
      top: 56px;
      padding: 16px 16px 16px 16px; } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .top-nav-wrapper {
      width: 100%;
      top: 56px; } }
  .top-nav-wrapper .top-nav-container {
    width: 100%;
    height: 100%;
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: center;
        align-items: center; }
    .top-nav-wrapper .top-nav-container .project-name {
      width: auto;
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: center;
          align-items: center;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
      .top-nav-wrapper .top-nav-container .project-name p {
        color: #FFFFFF;
        text-transform: capitalize; }
        .top-nav-wrapper .top-nav-container .project-name p:not(:last-child) {
          margin-right: 4px; }
          .top-nav-wrapper .top-nav-container .project-name p:not(:last-child)::after {
            content: " >";
            width: 20px; }
    .top-nav-wrapper .top-nav-container .right-controls {
      width: auto;
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      .top-nav-wrapper .top-nav-container .right-controls .lang {
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: center;
            align-items: center;
        cursor: pointer;
        margin-left: 16px; }
        .top-nav-wrapper .top-nav-container .right-controls .lang h3 {
          color: #FFFFFF; }
        .top-nav-wrapper .top-nav-container .right-controls .lang svg {
          display: block;
          width: 16px;
          margin-left: 4px; }
          .top-nav-wrapper .top-nav-container .right-controls .lang svg path {
            fill: #FFFFFF; }
      .top-nav-wrapper .top-nav-container .right-controls .time {
        margin-left: 16px;
        color: #FFFFFF; }
      .top-nav-wrapper .top-nav-container .right-controls .logout {
        margin-left: 16px;
        text-align: center;
        cursor: pointer; }
        .top-nav-wrapper .top-nav-container .right-controls .logout svg path {
          fill: #FFFFFF; }

.overview-card {
  width: 208px;
  background-color: #FFFFFF;
  border-radius: 8px;
  border: 1px solid #c4e2ff;
  padding: 18px 17px;
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  height: 112px;
  min-width: 208px;
  max-width: 208px; }
  .overview-card .icon {
    max-width: 48px;
    width: 100%;
    height: 48px;
    border-radius: 8px;
    background: linear-gradient(136.27deg, #C4E2FF 0%, #00CFDE 102.32%);
    text-align: center;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center; }
    .overview-card .icon svg path {
      fill: #FFFFFF; }
  .overview-card .card-name {
    margin-left: 16px;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: start;
        align-items: flex-start; }
    .overview-card .card-name h4 {
      text-transform: capitalize;
      color: #272838;
      opacity: 0.7; }
    .overview-card .card-name h3 {
      margin-top: 8px;
      text-transform: uppercase;
      color: #272838; }

.cards-wrapper {
  width: 100%;
  overflow-x: scroll; }
  .cards-wrapper::-webkit-scrollbar {
    display: none; }
  @media (max-width: 767px) {
    .cards-wrapper {
      padding-left: 16px; } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .cards-wrapper {
      padding-left: 16px; } }
  .cards-wrapper .cards-slider {
    width: 100%;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center;
    column-gap: 16px; }
    @media (max-width: 767px) {
      .cards-wrapper .cards-slider {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
            flex-direction: row;
        grid-template-columns: inherit;
        column-gap: inherit;
        width: -webkit-max-content;
        width: max-content; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .cards-wrapper .cards-slider {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
            flex-direction: row;
        grid-template-columns: inherit;
        column-gap: inherit;
        width: -webkit-max-content;
        width: max-content; } }
    @media (max-width: 767px) {
      .cards-wrapper .cards-slider .overview-card {
        margin-right: 16px; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .cards-wrapper .cards-slider .overview-card {
        margin-right: 16px; } }

.long-card-wrapper {
  background-color: #FFFFFF;
  border-radius: 8px;
  border: 1px solid rgba(16, 78, 249, 0.2);
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  max-width: 320px;
  width: 100%;
  padding: 0 16px;
  height: 100%;
  overflow: scroll;
  transition: all 0.3s; }
  @media (max-width: 767px) {
    .long-card-wrapper {
      padding: 0 0; } }
  .long-card-wrapper .top-head {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: center;
        align-items: center;
    width: 100%;
    padding-top: 16px;
    background-color: #FFFFFF;
    border-radius: 8px 8px 0px 0px;
    position: -webkit-sticky;
    position: sticky;
    top: 0; }
    @media (max-width: 767px) {
      .long-card-wrapper .top-head {
        padding-right: 16px;
        padding-left: 16px; } }
    .long-card-wrapper .top-head h2 {
      color: #272838; }
    .long-card-wrapper .top-head .calendar-wrap {
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      .long-card-wrapper .top-head .calendar-wrap p {
        color: #272838;
        margin: 0 4px; }
      .long-card-wrapper .top-head .calendar-wrap svg.calendar-icon {
        cursor: pointer;
        margin-left: 4px; }
        .long-card-wrapper .top-head .calendar-wrap svg.calendar-icon path {
          fill: rgba(48, 72, 80, 0.6); }
      .long-card-wrapper .top-head .calendar-wrap svg.cal-back {
        -ms-transform: rotate(180deg);
            transform: rotate(180deg); }
        .long-card-wrapper .top-head .calendar-wrap svg.cal-back path {
          stroke: rgba(48, 72, 80, 0.6);
          stroke-opacity: 1; }
      .long-card-wrapper .top-head .calendar-wrap svg.cal-back:hover {
        cursor: pointer; }
        .long-card-wrapper .top-head .calendar-wrap svg.cal-back:hover path {
          stroke: #165FFA;
          stroke-opacity: 1; }
      .long-card-wrapper .top-head .calendar-wrap svg.cal-next path {
        stroke: rgba(48, 72, 80, 0.6);
        stroke-opacity: 1; }
      .long-card-wrapper .top-head .calendar-wrap svg.cal-next:hover {
        cursor: pointer; }
        .long-card-wrapper .top-head .calendar-wrap svg.cal-next:hover path {
          stroke: #165FFA;
          stroke-opacity: 1; }
  .long-card-wrapper .detail-wrapper {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    width: 100%;
    -ms-touch-action: auto;
    touch-action: auto; }
    @media (max-width: 767px) {
      .long-card-wrapper .detail-wrapper {
        padding: 0 16px; } }
    .long-card-wrapper .detail-wrapper .detail {
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-align: center;
      align-items: center;
      padding: 8px 0 8px 0;
      width: 100%; }
      .long-card-wrapper .detail-wrapper .detail p {
        width: 50%;
        text-align: left; }
  .long-card-wrapper .more-option {
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center;
    width: 100%;
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    background-color: #FFFFFF;
    cursor: pointer;
    display: none;
    border-radius: 0 0 8px 8px; }
    @media (max-width: 767px) {
      .long-card-wrapper .more-option {
        display: -ms-flexbox;
        display: flex; } }
    .long-card-wrapper .more-option p {
      color: #389CFA;
      -ms-flex-pack: center;
          justify-content: center;
      -ms-flex-align: center;
          align-items: center;
      padding: 12px 0;
      width: 100%;
      height: 100%;
      background-color: #FFFFFF;
      text-align: center; }
      .long-card-wrapper .more-option p svg {
        margin-left: 8px;
        vertical-align: bottom; }
        .long-card-wrapper .more-option p svg path {
          fill: rgba(56, 156, 250, 0.4); }
    .long-card-wrapper .more-option p.show-less {
      background-color: #165FFA;
      color: #FFFFFF;
      display: none; }
      .long-card-wrapper .more-option p.show-less svg {
        -ms-transform: rotate(-180deg);
            transform: rotate(-180deg); }
        .long-card-wrapper .more-option p.show-less svg path {
          fill: #FFFFFF; }

.details-expand {
  max-height: 100%;
  height: 100% !important; }

.main-table-basic {
  min-width: -webkit-max-content;
  min-width: max-content;
  width: 100%;
  border-radius: 8px;
  background-color: #FFFFFF;
  position: relative; }
  .main-table-basic tr.headings {
    border-bottom: none; }
    .main-table-basic tr.headings th {
      text-align: left;
      padding: 15px 0;
      font-family: "Sans-Bold";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: inherit;
      color: #272838;
      font-weight: inherit;
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 99; }
      .main-table-basic tr.headings th svg {
        vertical-align: bottom;
        cursor: pointer; }
      .main-table-basic tr.headings th:first-child {
        padding-left: 24px; }
      .main-table-basic tr.headings th:last-child {
        padding-right: 24px; }
    .main-table-basic tr.headings:hover {
      background-color: transparent;
      cursor: inherit; }
      .main-table-basic tr.headings:hover::before {
        content: none; }
  .main-table-basic tr {
    border-bottom: 1px solid rgba(48, 72, 80, 0.05);
    cursor: pointer; }
    .main-table-basic tr td {
      font-family: "Sans-Regular";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: 0.28px;
      color: #272838;
      padding: 15px 0;
      position: relative; }
      .main-table-basic tr td:first-child {
        padding-left: 24px; }
        .main-table-basic tr td:first-child::before {
          content: "";
          height: 100%;
          width: 8px;
          background-color: #165FFA;
          left: 0;
          top: 0;
          z-index: 9;
          position: absolute;
          opacity: 0; }
      .main-table-basic tr td:last-child {
        padding-right: 24px; }
      .main-table-basic tr td .proj-icon {
        width: 16px;
        height: 16px;
        vertical-align: bottom;
        margin-right: 8px; }
      .main-table-basic tr td .progress-back {
        width: 64px;
        height: 8px;
        border-radius: 2px;
        background-color: rgba(48, 72, 80, 0.1);
        margin-left: 11px;
        display: inline-block; }
        .main-table-basic tr td .progress-back .progress {
          width: 20px;
          height: 100%;
          background: linear-gradient(136.27deg, #81EB9F 0%, #1EB971 102.32%); }
      .main-table-basic tr td p.priority {
        color: #FFFFFF;
        padding: 4px 10px;
        border-radius: 8px;
        width: -webkit-max-content;
        width: max-content; }
        .main-table-basic tr td p.priority.high {
          background-color: #FF6464; }
        .main-table-basic tr td p.priority.medium {
          background-color: #F4A021; }
        .main-table-basic tr td p.priority.low {
          background-color: #AB58FF; }
    .main-table-basic tr:hover {
      background-color: #C4E2FF; }
      .main-table-basic tr:hover > td::before {
        opacity: 1; }
  .main-table-basic tr.inactive td {
    color: #FF6464; }
    .main-table-basic tr.inactive td .proj-icon path {
      fill: #FF6464; }
    .main-table-basic tr.inactive td .progress-back .progress {
      background: #FF6464; }
  .main-table-basic tr.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none; }
    .main-table-basic tr.disabled td .progress-back .progress {
      background: rgba(48, 72, 80, 0.4); }

.main-table-1 {
  min-width: -webkit-max-content;
  min-width: max-content;
  width: 100%;
  border-radius: 8px;
  background-color: #FFFFFF;
  position: relative; }
  .main-table-1 tr.headings {
    border-bottom: none; }
    .main-table-1 tr.headings th {
      text-align: left;
      padding: 15px 0;
      font-family: "Sans-Bold";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: inherit;
      color: #272838;
      font-weight: inherit;
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 99; }
      .main-table-1 tr.headings th svg {
        vertical-align: bottom;
        cursor: pointer; }
      .main-table-1 tr.headings th:first-child {
        padding-left: 24px; }
      .main-table-1 tr.headings th:last-child {
        padding-right: 24px; }
    .main-table-1 tr.headings th:nth-child(1) {
      width: 121px; }
    .main-table-1 tr.headings th:nth-child(2) {
      width: 135px; }
    .main-table-1 tr.headings th:nth-child(3) {
      width: 105px; }
    .main-table-1 tr.headings th:nth-child(4) {
      width: 145px; }
    .main-table-1 tr.headings th:nth-child(5) {
      width: 134px; }
    .main-table-1 tr.headings th:nth-child(6) {
      width: 117px; }
    .main-table-1 tr.headings th:nth-child(7) {
      width: 114px; }
    .main-table-1 tr.headings th:nth-child(8) {
      width: 155px; }
    .main-table-1 tr.headings th:nth-child(9) {
      width: 163px; }
    .main-table-1 tr.headings:hover {
      background-color: transparent;
      cursor: inherit; }
      .main-table-1 tr.headings:hover::before {
        content: none; }
  .main-table-1 tr {
    border-bottom: 1px solid rgba(48, 72, 80, 0.05);
    cursor: pointer; }
    .main-table-1 tr td {
      font-family: "Sans-Regular";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: 0.28px;
      color: #272838;
      padding: 15px 0;
      position: relative; }
      .main-table-1 tr td:first-child {
        padding-left: 24px; }
        .main-table-1 tr td:first-child::before {
          content: "";
          height: 100%;
          width: 8px;
          background-color: #165FFA;
          left: 0;
          top: 0;
          z-index: 9;
          position: absolute;
          opacity: 0; }
      .main-table-1 tr td:last-child {
        padding-right: 24px; }
      .main-table-1 tr td .proj-icon {
        width: 16px;
        height: 16px;
        vertical-align: bottom;
        margin-right: 8px; }
      .main-table-1 tr td .progress-back {
        width: 64px;
        height: 8px;
        border-radius: 2px;
        background-color: rgba(48, 72, 80, 0.1);
        margin-left: 11px;
        display: inline-block; }
        .main-table-1 tr td .progress-back .progress {
          width: 20px;
          height: 100%;
          background: linear-gradient(136.27deg, #81EB9F 0%, #1EB971 102.32%); }
    .main-table-1 tr:hover {
      background-color: #C4E2FF; }
      .main-table-1 tr:hover > td::before {
        opacity: 1; }
  .main-table-1 tr.inactive td {
    color: #FF6464; }
    .main-table-1 tr.inactive td .proj-icon path {
      fill: #FF6464; }
    .main-table-1 tr.inactive td .progress-back .progress {
      background: #FF6464; }
  .main-table-1 tr.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none; }
    .main-table-1 tr.disabled td .progress-back .progress {
      background: rgba(48, 72, 80, 0.4); }

.main-table-2 {
  min-width: -webkit-max-content;
  min-width: max-content;
  width: 100%;
  border-radius: 8px;
  background-color: #FFFFFF;
  position: relative; }
  .main-table-2 tr.headings {
    border-bottom: none; }
    .main-table-2 tr.headings th {
      text-align: left;
      padding: 15px 0;
      font-family: "Sans-Bold";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: inherit;
      color: #272838;
      font-weight: inherit;
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 99; }
      .main-table-2 tr.headings th svg {
        vertical-align: bottom;
        cursor: pointer; }
      .main-table-2 tr.headings th:first-child {
        padding-left: 16px; }
      .main-table-2 tr.headings th:last-child {
        padding-right: 16px; }
    .main-table-2 tr.headings th:nth-child(1) {
      width: 63px; }
    .main-table-2 tr.headings th:nth-child(2) {
      width: 136px; }
    .main-table-2 tr.headings th:nth-child(3) {
      width: 161px; }
    .main-table-2 tr.headings th:nth-child(4) {
      width: 168px; }
    .main-table-2 tr.headings th:nth-child(5) {
      width: 168px; }
    .main-table-2 tr.headings th:nth-child(6) {
      width: 89px; }
    .main-table-2 tr.headings th:nth-child(7) {
      width: 104px; }
    .main-table-2 tr.headings th:nth-child(8) {
      width: 156px; }
    .main-table-2 tr.headings th:nth-child(9) {
      width: 164px; }
    .main-table-2 tr.headings:hover {
      background-color: transparent;
      cursor: inherit; }
      .main-table-2 tr.headings:hover::before {
        content: none; }
  .main-table-2 tr {
    border-bottom: 1px solid rgba(48, 72, 80, 0.05);
    cursor: pointer; }
    .main-table-2 tr td {
      font-family: "Sans-Regular";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: 0.28px;
      color: #272838;
      padding: 15px 0;
      position: relative; }
      .main-table-2 tr td:first-child {
        padding-left: 24px; }
        .main-table-2 tr td:first-child::before {
          content: "";
          height: 100%;
          width: 8px;
          background-color: #165FFA;
          left: 0;
          top: 0;
          z-index: 9;
          position: absolute;
          opacity: 0; }
      .main-table-2 tr td:last-child {
        padding-right: 24px; }
      .main-table-2 tr td .proj-icon {
        width: 16px;
        height: 16px;
        vertical-align: bottom;
        margin-right: 8px; }
      .main-table-2 tr td .progress-back {
        width: 64px;
        height: 8px;
        border-radius: 2px;
        background-color: rgba(48, 72, 80, 0.1);
        margin-left: 11px;
        display: inline-block; }
        .main-table-2 tr td .progress-back .progress {
          width: 20px;
          height: 100%;
          background: linear-gradient(136.27deg, #81EB9F 0%, #1EB971 102.32%); }
    .main-table-2 tr:hover {
      background-color: #C4E2FF; }
      .main-table-2 tr:hover > td::before {
        opacity: 1; }
  .main-table-2 tr.inactive td {
    color: #FF6464; }
    .main-table-2 tr.inactive td .proj-icon path {
      fill: #FF6464; }
    .main-table-2 tr.inactive td .progress-back .progress {
      background: #FF6464; }
  .main-table-2 tr.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none; }
    .main-table-2 tr.disabled td .progress-back .progress {
      background: rgba(48, 72, 80, 0.4); }

.main-table-3 {
  min-width: -webkit-max-content;
  min-width: max-content;
  width: 100%;
  border-radius: 8px;
  background-color: #FFFFFF;
  position: relative; }
  .main-table-3 tr.headings {
    border-bottom: none; }
    .main-table-3 tr.headings th {
      text-align: left;
      padding: 15px 0;
      font-family: "Sans-Bold";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: inherit;
      color: #272838;
      font-weight: inherit;
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 99; }
      .main-table-3 tr.headings th svg {
        vertical-align: bottom;
        cursor: pointer; }
      .main-table-3 tr.headings th:first-child {
        padding-left: 16px; }
      .main-table-3 tr.headings th:last-child {
        padding-right: 16px; }
    .main-table-3 tr.headings th:nth-child(1) {
      width: 71px; }
    .main-table-3 tr.headings th:nth-child(2) {
      width: 232px; }
    .main-table-3 tr.headings th:nth-child(3) {
      width: 211px; }
    .main-table-3 tr.headings th:nth-child(4) {
      width: 193px; }
    .main-table-3 tr.headings th:nth-child(5) {
      width: 268px; }
    .main-table-3 tr.headings:hover {
      background-color: transparent;
      cursor: inherit; }
      .main-table-3 tr.headings:hover::before {
        content: none; }
  .main-table-3 tr {
    border-bottom: 1px solid rgba(48, 72, 80, 0.05);
    cursor: pointer; }
    .main-table-3 tr td {
      font-family: "Sans-Regular";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: 0.28px;
      color: #272838;
      padding: 15px 0;
      position: relative; }
      .main-table-3 tr td:first-child {
        padding-left: 24px; }
        .main-table-3 tr td:first-child::before {
          content: "";
          height: 100%;
          width: 8px;
          background-color: #165FFA;
          left: 0;
          top: 0;
          z-index: 9;
          position: absolute;
          opacity: 0; }
      .main-table-3 tr td:last-child {
        padding-right: 24px; }
      .main-table-3 tr td .proj-icon {
        width: 16px;
        height: 16px;
        vertical-align: bottom;
        margin-right: 8px; }
      .main-table-3 tr td .progress-back {
        width: 64px;
        height: 8px;
        border-radius: 2px;
        background-color: rgba(48, 72, 80, 0.1);
        margin-left: 11px;
        display: inline-block; }
        .main-table-3 tr td .progress-back .progress {
          width: 20px;
          height: 100%;
          background: linear-gradient(136.27deg, #81EB9F 0%, #1EB971 102.32%); }
    .main-table-3 tr:hover {
      background-color: #C4E2FF; }
      .main-table-3 tr:hover > td::before {
        opacity: 1; }
  .main-table-3 tr.inactive td {
    color: #FF6464; }
    .main-table-3 tr.inactive td .proj-icon path {
      fill: #FF6464; }
    .main-table-3 tr.inactive td .progress-back .progress {
      background: #FF6464; }
  .main-table-3 tr.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none; }
    .main-table-3 tr.disabled td .progress-back .progress {
      background: rgba(48, 72, 80, 0.4); }

.main-table-4 {
  min-width: -webkit-max-content;
  min-width: max-content;
  width: 100%;
  border-radius: 8px;
  background-color: #FFFFFF;
  position: relative; }
  .main-table-4 tr.headings {
    border-bottom: none; }
    .main-table-4 tr.headings th {
      text-align: left;
      padding: 15px 0;
      font-family: "Sans-Bold";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: inherit;
      color: #272838;
      font-weight: inherit;
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 99; }
      .main-table-4 tr.headings th svg {
        vertical-align: bottom;
        cursor: pointer; }
      .main-table-4 tr.headings th:first-child {
        padding-left: 16px; }
      .main-table-4 tr.headings th:last-child {
        padding-right: 16px; }
    .main-table-4 tr.headings th:nth-child(1) {
      width: 126px; }
    .main-table-4 tr.headings th:nth-child(2) {
      width: 206px; }
    .main-table-4 tr.headings th:nth-child(3) {
      width: 128px; }
    .main-table-4 tr.headings th:nth-child(4) {
      width: 178px; }
    .main-table-4 tr.headings th:nth-child(5) {
      width: 194px; }
    .main-table-4 tr.headings th:nth-child(6) {
      width: 169px; }
    .main-table-4 tr.headings th:nth-child(7) {
      width: 160px; }
    .main-table-4 tr.headings:hover {
      background-color: transparent;
      cursor: inherit; }
      .main-table-4 tr.headings:hover::before {
        content: none; }
  .main-table-4 tr {
    border-bottom: 1px solid rgba(48, 72, 80, 0.05);
    cursor: pointer; }
    .main-table-4 tr td {
      font-family: "Sans-Regular";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: 0.28px;
      color: #272838;
      padding: 15px 0;
      position: relative; }
      .main-table-4 tr td:first-child {
        padding-left: 24px; }
        .main-table-4 tr td:first-child::before {
          content: "";
          height: 100%;
          width: 8px;
          background-color: #165FFA;
          left: 0;
          top: 0;
          z-index: 9;
          position: absolute;
          opacity: 0; }
      .main-table-4 tr td:last-child {
        padding-right: 24px; }
      .main-table-4 tr td .proj-icon {
        width: 16px;
        height: 16px;
        vertical-align: bottom;
        margin-right: 8px; }
      .main-table-4 tr td .progress-back {
        width: 64px;
        height: 8px;
        border-radius: 2px;
        background-color: rgba(48, 72, 80, 0.1);
        margin-left: 11px;
        display: inline-block; }
        .main-table-4 tr td .progress-back .progress {
          width: 20px;
          height: 100%;
          background: linear-gradient(136.27deg, #81EB9F 0%, #1EB971 102.32%); }
    .main-table-4 tr:hover {
      background-color: #C4E2FF; }
      .main-table-4 tr:hover > td::before {
        opacity: 1; }
  .main-table-4 tr.inactive td {
    color: #FF6464; }
    .main-table-4 tr.inactive td .proj-icon path {
      fill: #FF6464; }
    .main-table-4 tr.inactive td .progress-back .progress {
      background: #FF6464; }
  .main-table-4 tr.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none; }
    .main-table-4 tr.disabled td .progress-back .progress {
      background: rgba(48, 72, 80, 0.4); }

.main-table-5 {
  min-width: -webkit-max-content;
  min-width: max-content;
  width: 100%;
  border-radius: 8px;
  background-color: #FFFFFF;
  position: relative; }
  .main-table-5 tr.headings {
    border-bottom: none; }
    .main-table-5 tr.headings th {
      text-align: left;
      padding: 15px 0;
      font-family: "Sans-Bold";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: inherit;
      color: #272838;
      font-weight: inherit;
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 99; }
      .main-table-5 tr.headings th svg {
        vertical-align: bottom;
        cursor: pointer; }
      .main-table-5 tr.headings th:first-child {
        padding-left: 16px; }
      .main-table-5 tr.headings th:last-child {
        padding-right: 16px; }
    .main-table-5 tr.headings th:nth-child(1) {
      width: 128px; }
    .main-table-5 tr.headings th:nth-child(2) {
      width: 278px; }
    .main-table-5 tr.headings th:nth-child(3) {
      width: 128px; }
    .main-table-5 tr.headings th:nth-child(4) {
      width: 177px; }
    .main-table-5 tr.headings th:nth-child(5) {
      width: 194px; }
    .main-table-5 tr.headings th:nth-child(6) {
      width: 191px; }
    .main-table-5 tr.headings th:nth-child(7) {
      width: 156px; }
    .main-table-5 tr.headings th:nth-child(8) {
      width: 135px; }
    .main-table-5 tr.headings:hover {
      background-color: transparent;
      cursor: inherit; }
      .main-table-5 tr.headings:hover::before {
        content: none; }
  .main-table-5 tr {
    border-bottom: 1px solid rgba(48, 72, 80, 0.05);
    cursor: pointer; }
    .main-table-5 tr td {
      font-family: "Sans-Regular";
      font-size: 12px;
      line-height: 16px;
      letter-spacing: 0.28px;
      color: #272838;
      padding: 15px 0;
      position: relative; }
      .main-table-5 tr td:first-child {
        padding-left: 24px; }
        .main-table-5 tr td:first-child::before {
          content: "";
          height: 100%;
          width: 8px;
          background-color: #165FFA;
          left: 0;
          top: 0;
          z-index: 9;
          position: absolute;
          opacity: 0; }
      .main-table-5 tr td:last-child {
        padding-right: 24px; }
      .main-table-5 tr td .proj-icon {
        width: 16px;
        height: 16px;
        vertical-align: bottom;
        margin-right: 8px; }
      .main-table-5 tr td .progress-back {
        width: 64px;
        height: 8px;
        border-radius: 2px;
        background-color: rgba(48, 72, 80, 0.1);
        margin-left: 11px;
        display: inline-block; }
        .main-table-5 tr td .progress-back .progress {
          width: 20px;
          height: 100%;
          background: linear-gradient(136.27deg, #81EB9F 0%, #1EB971 102.32%); }
    .main-table-5 tr:hover {
      background-color: #C4E2FF; }
      .main-table-5 tr:hover > td::before {
        opacity: 1; }
  .main-table-5 tr.inactive td {
    color: #FF6464; }
    .main-table-5 tr.inactive td .proj-icon path {
      fill: #FF6464; }
    .main-table-5 tr.inactive td .progress-back .progress {
      background: #FF6464; }
  .main-table-5 tr.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none; }
    .main-table-5 tr.disabled td .progress-back .progress {
      background: rgba(48, 72, 80, 0.4); }

.white-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 48px;
  background-color: #FFFFFF;
  border-radius: 8px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
  z-index: 99;
  border-bottom: 4px solid rgba(48, 72, 80, 0.05); }

.table-wrapper {
  width: 100%;
  height: 100%;
  background-color: transparent;
  overflow: scroll; }
  .table-wrapper::-webkit-scrollbar {
    width: 4px;
    height: 4px; }
  .table-wrapper::-webkit-scrollbar-track {
    background-color: transparent;
    margin-top: 48px; }
  .table-wrapper::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: rgba(48, 72, 80, 0.4); }
  .table-wrapper table {
    background-color: transparent; }

.graph-wrapper {
  width: 100%;
  background-color: #FFFFFF;
  border-radius: 8px;
  border: 1px solid rgba(16, 78, 249, 0.2);
  box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
  padding: 16px;
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  height: 304px; }
  .graph-wrapper .value-head {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: center;
        align-items: center;
    width: 100%; }
    .graph-wrapper .value-head .proj-name {
      color: #272838; }
    .graph-wrapper .value-head .proj-value {
      color: #389CFA; }
    .graph-wrapper .value-head .calendar-wrap {
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      .graph-wrapper .value-head .calendar-wrap p {
        color: #272838;
        margin: 0 4px; }
      .graph-wrapper .value-head .calendar-wrap svg.calendar-icon {
        cursor: pointer;
        margin-left: 4px; }
        .graph-wrapper .value-head .calendar-wrap svg.calendar-icon path {
          fill: #389CFA; }
      .graph-wrapper .value-head .calendar-wrap svg.cal-back {
        -ms-transform: rotate(180deg);
            transform: rotate(180deg); }
        .graph-wrapper .value-head .calendar-wrap svg.cal-back path {
          stroke: rgba(48, 72, 80, 0.6); }
      .graph-wrapper .value-head .calendar-wrap svg.cal-back:hover {
        cursor: pointer; }
        .graph-wrapper .value-head .calendar-wrap svg.cal-back:hover path {
          stroke: #165FFA;
          stroke-opacity: 1; }
      .graph-wrapper .value-head .calendar-wrap svg.cal-next path {
        stroke: rgba(48, 72, 80, 0.6);
        stroke-opacity: 1; }
      .graph-wrapper .value-head .calendar-wrap svg.cal-next:hover {
        cursor: pointer; }
        .graph-wrapper .value-head .calendar-wrap svg.cal-next:hover path {
          stroke: #165FFA;
          stroke-opacity: 1; }
  .graph-wrapper .graph {
    margin-top: 12px;
    width: 100%;
    height: 100%; }
    .graph-wrapper .graph > div {
      width: 100% !important;
      height: 100% !important; }
      .graph-wrapper .graph > div svg {
        width: 100% !important; }

@media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
  .history-tree-view-wrapper {
    margin-left: 0px !important;
    width: 100% !important;
    height: calc(100vh - 56px) !important; } }
.history-tree-view-wrapper .content-wrapper {
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row; }
  .history-tree-view-wrapper .content-wrapper .history-tree-view-block {
    background-color: #FFFFFF;
    max-width: 432px;
    width: 100%;
    height: calc(100vh - 126px);
    border-radius: 8px;
    padding: 16px; }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block {
        height: calc(100vh - 156px) !important; } }
    @media (max-width: 767px) {
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block {
        height: calc(100vh - 136px) !important; } }
    .history-tree-view-wrapper .content-wrapper .history-tree-view-block form {
      margin-top: 24px; }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper:nth-child(1) {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
            flex-direction: row;
        -ms-flex-align: end;
            align-items: flex-end; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper:nth-child(1) .input_box {
          width: 100%; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper:nth-child(1) button.fill-basic-button {
          max-height: 48px;
          height: 48px;
          max-width: 55px;
          width: 100%;
          margin-left: 16px;
          box-shadow: none; }
          @media (max-width: 767px) {
            .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper:nth-child(1) button.fill-basic-button {
              height: 32px;
              margin-left: 8px; } }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper .Chevron-down {
        position: absolute;
        top: 44px;
        right: 80px; }
        @media (max-width: 767px) {
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper .Chevron-down {
            top: 34px;
            right: 72px; } }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper .search-icon:nth-child(2) {
        top: 28px; }
        @media (max-width: 767px) {
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block form .input-wrapper .search-icon:nth-child(2) {
            top: 24px; } }
    .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree {
      height: calc(100% - 202px);
      overflow-y: scroll;
      margin-top: 2px; }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree::-webkit-scrollbar {
        width: 4px;
        height: 4px; }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree::-webkit-scrollbar-track {
        background-color: transparent; }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree::-webkit-scrollbar-thumb {
        border-radius: 8px;
        background-color: rgba(48, 72, 80, 0.4); }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .nav-wrap {
        width: 100%; }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree [hidden] {
        display: none;
        visibility: hidden; }
      .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav {
        width: 100%; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__list {
          padding: 0;
          margin: 0;
          list-style: none; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children .acnav__label {
          background: rgba(48, 72, 80, 0.1); }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children .acnav__label:focus, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children .acnav__label:hover {
            background: #C4E2FF; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children svg.Chevron-down {
          margin-left: auto;
          transition: transform .3s; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children.is-open .acnav__label {
          background: #C4E2FF; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children.is-open svg.Chevron-down {
          margin-left: auto;
          -ms-transform: rotate(180deg);
              transform: rotate(180deg); }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children.is-open svg.Chevron-down path {
            fill: #165FFA; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children2 .acnav__label2 {
          background: #FFFFFF; }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children2 .acnav__label2:focus, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children2 .acnav__label2:hover {
            background: #C4E2FF; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children2 svg.Chevron-down2 {
          margin-left: auto;
          transition: transform .3s; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children2.is-open .acnav__label2 {
          background: #C4E2FF; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children2.is-open svg.Chevron-down2 {
          margin-left: auto;
          -ms-transform: rotate(180deg);
              transform: rotate(180deg); }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .has-children2.is-open svg.Chevron-down2 path {
            fill: #165FFA; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label2 {
          display: -ms-flexbox;
          display: flex;
          font-size: 16px;
          line-height: 24px;
          border-radius: 8px;
          padding: 8px;
          margin: 0;
          cursor: pointer;
          color: #272838;
          margin-top: 8px; }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link h4, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label h4, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label2 h4 {
            margin-left: 8px; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link--level2, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label--level2 {
          margin-left: 16px;
          background: #FFFFFF;
          border-bottom: 1px solid rgba(48, 72, 80, 0.1); }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link--level3, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label--level3 {
          margin-left: 34px;
          background: #FFFFFF;
          border-bottom: 1px solid rgba(48, 72, 80, 0.1); }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link--level3:focus, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link--level3:hover, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label--level3:focus, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label--level3:hover {
            background: #e8e8e8; }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link--level3 li, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label--level3 li {
            display: -ms-flexbox;
            display: flex; }
          .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__link--level3 h4, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__label--level3 h4 {
            color: rgba(48, 72, 80, 0.6); }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__list--level2, .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__list--level3 {
          display: none; }
          .is-open > .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__list--level2, .is-open > .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav__list--level3 {
            display: block;
            border-bottom: 1px solid rgba(48, 72, 80, 0.1); }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .acnav__link.active svg path {
          fill: #165FFA; }
        .history-tree-view-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree .acnav .acnav__link.active h4 {
          color: #165FFA; }

button.primary-cta {
  min-width: 100px;
  width: auto;
  color: #272838;
  box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
  padding: 11px 16px;
  background: #FFFFFF;
  border-radius: 8px;
  border: 1px solid rgba(16, 78, 249, 0.2);
  cursor: pointer;
  font-family: 'Sans-Medium';
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.28px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center; }
  @media (max-width: 767px) {
    button.primary-cta {
      min-width: 80px;
      padding: 7px 8px; } }
  button.primary-cta:hover {
    color: #165FFA; }
  button.primary-cta:active {
    border: 1px solid transparent;
    background-color: #165FFA;
    color: #FFFFFF; }
  button.primary-cta.disabled {
    border: 1px solid rgba(48, 72, 80, 0.1);
    color: rgba(48, 72, 80, 0.4);
    pointer-events: none;
    cursor: not-allowed;
    -webkit-user-select: none; }
  button.primary-cta.active {
    background-color: #165FFA;
    color: #FFFFFF; }

button.primary-cta.no-border {
  border: none; }

button.medium-cta {
  min-width: 100px;
  width: auto;
  color: #272838;
  box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
  padding: 7px 8px;
  background: #FFFFFF;
  border-radius: 8px;
  border: 1px solid rgba(16, 78, 249, 0.2);
  cursor: pointer;
  font-family: 'Sans-Medium';
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.28px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center; }
  @media (max-width: 767px) {
    button.medium-cta {
      min-width: 80px;
      padding: 3px 8px; } }
  button.medium-cta:hover {
    color: #165FFA; }
  button.medium-cta:active {
    border: 1px solid transparent;
    background-color: #165FFA;
    color: #FFFFFF; }
  button.medium-cta.disabled {
    border: 1px solid rgba(48, 72, 80, 0.1);
    color: rgba(48, 72, 80, 0.4);
    pointer-events: none;
    cursor: not-allowed;
    -webkit-user-select: none; }
  button.medium-cta.active {
    background-color: #165FFA;
    color: #FFFFFF; }

button.medium-cta.no-border {
  border: none; }

button#all-button, button#in-button {
  padding: 9px 16px;
  border-radius: 8px;
  background-color: #FFFFFF;
  border: 1px solid rgba(16, 78, 249, 0.2);
  text-align: center;
  cursor: pointer; }
  @media (max-width: 767px) {
    button#all-button, button#in-button {
      min-height: 44px;
      max-height: 44px;
      height: 100%; } }

button#filter {
  padding: 10px;
  border-radius: 8px;
  text-align: center;
  background-color: rgba(48, 72, 80, 0.05);
  cursor: pointer;
  max-height: 44px; }
  button#filter svg path {
    fill: #272838; }
  button#filter.active {
    background-color: #165FFA; }
    button#filter.active svg path {
      fill: #FFFFFF; }

button#map {
  padding: 10px;
  border-radius: 8px;
  text-align: center;
  background-color: rgba(48, 72, 80, 0.05);
  cursor: pointer;
  max-height: 44px; }
  button#map svg path {
    stroke: #272838; }
  button#map.active {
    background-color: #165FFA; }
    button#map.active svg path {
      stroke: #FFFFFF; }

button.fill-basic-button {
  padding: 8px;
  border-radius: 8px;
  background-color: #FFFFFF;
  border: 1px solid rgba(16, 78, 249, 0.2);
  text-align: center;
  cursor: pointer;
  box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
  min-height: 40px;
  max-height: 40px; }
  @media (max-width: 767px) {
    button.fill-basic-button {
      min-height: 40px;
      max-height: 40px;
      height: 100%; } }

button.fill-basic-button.disable {
  opacity: 0.5;
  cursor: none;
  pointer-events: none; }

.multiple-button-wrapper {
  width: -webkit-max-content;
  width: max-content;
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
  border: 1px solid rgba(56, 156, 250, 0.4);
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: center;
      align-items: center;
  max-height: 44px; }
  .multiple-button-wrapper button {
    width: -webkit-max-content;
    width: max-content;
    padding: 10px 16px;
    background-color: transparent;
    border-radius: 8px;
    color: rgba(48, 72, 80, 0.6);
    cursor: pointer;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center; }
  .multiple-button-wrapper button.active {
    background-color: #165FFA;
    color: #FFFFFF; }

button.primary-tab {
  padding: 10px 16px;
  background-color: #FFFFFF;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  border-radius: 8px;
  color: rgba(48, 72, 80, 0.6);
  font-family: 'Sans-Bold';
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.28px;
  box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
  border: none; }
  @media (max-width: 767px) {
    button.primary-tab {
      font-size: 12px;
      line-height: 16px; } }
  button.primary-tab.active {
    background-color: #165FFA;
    color: #FFFFFF; }
  button.primary-tab:hover {
    background-color: #165FFA;
    color: #FFFFFF; }

.login-wrapper {
  width: 100%;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  height: 100vh;
  background-color: #272838; }
  @media (max-width: 767px) {
    .login-wrapper {
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
      height: auto;
      min-height: 100vh; } }
  .login-wrapper .left-side {
    width: 49.5%; }
    @media (max-width: 767px) {
      .login-wrapper .left-side {
        width: 100%; } }
  .login-wrapper .right-side {
    width: 50.5%; }
    @media (max-width: 767px) {
      .login-wrapper .right-side {
        width: 100%; } }
  .login-wrapper .left-side {
    background: url("../../build/images/login/leftimage.png");
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%; }
    @media (max-width: 767px) {
      .login-wrapper .left-side {
        height: auto; } }
    .login-wrapper .left-side .black-gradient {
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(180deg, rgba(39, 40, 56, 0.68) 0%, rgba(39, 40, 56, 0) 100%); }
    .login-wrapper .left-side-wrapper {
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-align: start;
          align-items: flex-start;
      height: 100%; }
      .login-wrapper .left-side-wrapper div h3 {
        font-family: "Sans-SemiBold";
        font-size: 24px;
        line-height: 32px;
        color: #FFFFFF; }
        @media (max-width: 767px) {
          .login-wrapper .left-side-wrapper div h3 {
            font-size: 14px;
            line-height: 24px; } }
      .login-wrapper .left-side-wrapper div h1 {
        font-family: "Sans-Bold";
        font-style: normal;
        font-size: 40px;
        line-height: 52px;
        color: #5ED7FB; }
        @media (max-width: 767px) {
          .login-wrapper .left-side-wrapper div h1 {
            font-size: 20px;
            line-height: 32px; } }
      .login-wrapper .left-side-wrapper div h2 {
        font-family: "Sans-Regular";
        font-style: normal;
        font-weight: normal;
        font-size: 20px;
        line-height: 32px;
        color: #FFFFFF; }
        @media (max-width: 767px) {
          .login-wrapper .left-side-wrapper div h2 {
            display: none; } }
        @media (min-width: 768px) and (max-width: 1023px) {
          .login-wrapper .left-side-wrapper div h2 {
            display: none; } }
      .login-wrapper .left-side-wrapper h4.version {
        font-family: "Sans-Bold";
        font-style: normal;
        font-size: 16px;
        line-height: 24px;
        color: #FFFFFF; }
        @media (max-width: 767px) {
          .login-wrapper .left-side-wrapper h4.version {
            font-family: "Sans-Regular";
            font-size: 12px;
            line-height: 16px; } }
  .login-wrapper .right-side {
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center;
    height: 100%;
    overflow: hidden; }
    @media (max-width: 767px) {
      .login-wrapper .right-side {
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
        overflow: initial; } }
    @media (max-width: 767px) {
      .login-wrapper .right-side .form-logo {
        max-width: 179px;
        width: 100%; } }
    .login-wrapper .right-side-wrapper {
      max-width: 502px;
      width: 100%;
      margin: 0 auto;
      padding: 0 24px; }
      @media (max-width: 767px) {
        .login-wrapper .right-side-wrapper {
          max-width: 100%; } }
      .login-wrapper .right-side-wrapper form .input-wrapper label {
        color: #FFFFFF; }
      .login-wrapper .right-side-wrapper form .input-wrapper input {
        border: 1px solid rgba(255, 255, 255, 0.4);
        color: rgba(255, 255, 255, 0.4);
        background-color: transparent; }
        .login-wrapper .right-side-wrapper form .input-wrapper input:-ms-input-placeholder {
          color: rgba(255, 255, 255, 0.4); }
        .login-wrapper .right-side-wrapper form .input-wrapper input::placeholder {
          color: rgba(255, 255, 255, 0.4); }
      .login-wrapper .right-side-wrapper form .login-cta button {
        border: 1px solid transparent;
        background-color: #165FFA;
        color: #FFFFFF; }
      .login-wrapper .right-side-wrapper form a.forgot {
        text-transform: uppercase;
        color: rgba(255, 255, 255, 0.7);
        cursor: pointer; }
      .login-wrapper .right-side-wrapper form .password-wrapper .eye-icon {
        right: 16px;
        bottom: 8px;
        z-index: 999;
        cursor: pointer; }
        @media (max-width: 767px) {
          .login-wrapper .right-side-wrapper form .password-wrapper .eye-icon {
            bottom: 5px; } }
        .login-wrapper .right-side-wrapper form .password-wrapper .eye-icon svg path {
          fill: rgba(255, 255, 255, 0.4); }
        .login-wrapper .right-side-wrapper form .password-wrapper .eye-icon svg#eye-off {
          position: absolute; }
        .login-wrapper .right-side-wrapper form .password-wrapper .eye-icon svg#eye-on {
          opacity: 0; }
    .login-wrapper .right-side .pat-top {
      top: 64px;
      right: 64px;
      z-index: 0; }
      @media (max-width: 767px) {
        .login-wrapper .right-side .pat-top {
          display: none; } }
    .login-wrapper .right-side .pat-bottom {
      bottom: -20px;
      left: 48px;
      z-index: 0; }
      @media (max-width: 767px) {
        .login-wrapper .right-side .pat-bottom {
          display: none; } }
  .login-wrapper .force-login-wrapper {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(48, 72, 80, 0.6);
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center; }
    .login-wrapper .force-login-wrapper .force-login-content-wrapper {
      max-width: 582px;
      width: 100%;
      padding: 0 16px;
      margin: 0 auto; }
      .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content {
        background-color: #FAFAFA;
        border-radius: 8px;
        height: auto;
        -ms-flex-pack: center;
            justify-content: center;
        -ms-flex-align: center;
            align-items: center;
        padding: 44px 32px;
        position: relative;
        box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08); }
        @media (max-width: 767px) {
          .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content {
            padding: 44px 24px; } }
        .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content h3 {
          color: #272838;
          max-width: 370px;
          text-align: center; }
        .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content .options {
          width: 100%;
          margin-top: 32px;
          max-width: 370px;
          -ms-flex-pack: justify;
              justify-content: space-between;
          -ms-flex-align: center;
              align-items: center; }
        .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content svg {
          position: absolute;
          top: 16px;
          right: 16px;
          cursor: pointer; }
          .login-wrapper .force-login-wrapper .force-login-content-wrapper .force-content svg path {
            fill: rgba(48, 72, 80, 0.4); }

.navigation-wrapper {
  left: 0;
  top: 0;
  height: 100vh;
  z-index: 9997; }
  @media (max-width: 767px) {
    .navigation-wrapper {
      height: auto;
      position: relative; } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .navigation-wrapper {
      height: auto;
      position: relative; } }
  .navigation-wrapper .pannel-wrapper {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: start;
        align-items: flex-start;
    background-color: #165FFA;
    width: 64px;
    height: 100%;
    z-index: 2; }
    @media (max-width: 767px) {
      .navigation-wrapper .pannel-wrapper {
        display: none; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .navigation-wrapper .pannel-wrapper {
        display: none; } }
    .navigation-wrapper .pannel-wrapper .top {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: center;
          align-items: center;
      width: 100%; }
      .navigation-wrapper .pannel-wrapper .top > div {
        width: 100%; }
      .navigation-wrapper .pannel-wrapper .top .devices-wrapper {
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: center;
            align-items: center; }
        .navigation-wrapper .pannel-wrapper .top .devices-wrapper .devices {
          padding: 16px;
          text-align: center;
          cursor: pointer;
          max-width: 64px; }
          .navigation-wrapper .pannel-wrapper .top .devices-wrapper .devices:hover {
            background-color: rgba(56, 156, 250, 0.4); }
          .navigation-wrapper .pannel-wrapper .top .devices-wrapper .devices svg path {
            fill: #FFFFFF; }
        .navigation-wrapper .pannel-wrapper .top .devices-wrapper .slider-arrows {
          border-radius: 20px;
          cursor: pointer;
          transition: all 0.3s; }
          .navigation-wrapper .pannel-wrapper .top .devices-wrapper .slider-arrows:hover {
            background-color: #FFFFFF; }
            .navigation-wrapper .pannel-wrapper .top .devices-wrapper .slider-arrows:hover path.specific-arrow {
              fill: #165FFA; }
        .navigation-wrapper .pannel-wrapper .top .devices-wrapper .slick-arrow[aria-disabled="true"] {
          opacity: 0;
          pointer-events: none;
          cursor: not-allowed; }
        .navigation-wrapper .pannel-wrapper .top .devices-wrapper .slider-arrows-down {
          margin-top: 40px; }
        .navigation-wrapper .pannel-wrapper .top .devices-wrapper .slick-list {
          margin-top: 40px; }
    .navigation-wrapper .pannel-wrapper .bottom {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: center;
          align-items: center;
      width: 100%; }
      .navigation-wrapper .pannel-wrapper .bottom > div {
        padding: 16px;
        cursor: pointer;
        width: 100%;
        text-align: center; }
        .navigation-wrapper .pannel-wrapper .bottom > div:hover {
          background-color: rgba(56, 156, 250, 0.4); }
        .navigation-wrapper .pannel-wrapper .bottom > div svg path {
          fill: #FFFFFF; }
      .navigation-wrapper .pannel-wrapper .bottom div#settings:hover svg {
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
        transition: all 0.5s; }
  .navigation-wrapper .nav-devices-details {
    top: 0;
    left: 0;
    margin-left: 64px;
    height: 100%; }
    @media (max-width: 767px) {
      .navigation-wrapper .nav-devices-details {
        display: none; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .navigation-wrapper .nav-devices-details {
        display: none; } }
  .navigation-wrapper .mob-navigation-wrapper {
    display: none; }
    @media (max-width: 767px) {
      .navigation-wrapper .mob-navigation-wrapper {
        height: 56px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
        width: 100%;
        overflow-y: scroll; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .navigation-wrapper .mob-navigation-wrapper {
        height: 56px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
        width: 100%;
        overflow-y: scroll; } }
    .navigation-wrapper .mob-navigation-wrapper .header {
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-align: center;
          align-items: center;
      width: 100%;
      background-color: #104EF9;
      top: 0;
      left: 0;
      z-index: 3;
      padding: 16px 0 16px 16px; }
      .navigation-wrapper .mob-navigation-wrapper .header a svg path {
        fill: #FFFFFF; }
      .navigation-wrapper .mob-navigation-wrapper .header .hamburger {
        padding: 0 16px;
        text-align: center;
        vertical-align: middle;
        height: 24px; }
    .navigation-wrapper .mob-navigation-wrapper .header-index {
      z-index: 2; }
    .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
      background-color: #165FFA;
      width: 100%;
      min-height: calc(100vh - 56px);
      height: auto;
      margin-top: 56px;
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
      opacity: 0;
      transition: all 0.5s;
      width: 100%;
      left: 0;
      z-index: 2; }
      .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper {
        width: 100%; }
        .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a {
          -ms-flex-pack: justify;
              justify-content: space-between;
          -ms-flex-align: center;
              align-items: center;
          padding: 16px;
          text-decoration: none;
          color: #FFFFFF;
          width: 100%; }
          .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a:active {
            background-color: rgba(56, 156, 250, 0.4); }
          .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a > div {
            -ms-flex-pack: start;
                justify-content: flex-start;
            -ms-flex-align: center;
                align-items: center;
            width: auto; }
            .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a > div svg {
              width: 24px;
              height: 24px;
              -ms-transform: rotate(0deg);
                  transform: rotate(0deg); }
              .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a > div svg path {
                fill: #FFFFFF; }
            .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a > div p {
              color: #FFFFFF;
              text-transform: uppercase;
              margin-left: 8px; }
          .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a .r-arrow {
            width: 24px;
            height: 24px;
            -ms-transform: rotate(90deg);
                transform: rotate(90deg);
            transition: all 0.3s; }
            .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a .r-arrow path {
              fill: rgba(255, 255, 255, 0.7); }
          .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper a .r-arrow-anim {
            -ms-transform: rotate(-90deg);
                transform: rotate(-90deg); }
        .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items {
          background-color: #FFFFFF;
          width: 100%;
          display: none; }
          .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items li a {
            padding: 16px;
            -ms-flex-pack: start;
                justify-content: flex-start;
            -ms-flex-align: center;
                align-items: center;
            color: #272838;
            text-decoration: none;
            text-transform: uppercase; }
            .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items li a span.pill {
              font-family: 'Sans-Regular';
              font-style: normal;
              font-weight: 500;
              font-size: 10px;
              line-height: 16px;
              padding: 0 4px;
              color: #FFFFFF;
              background-color: #165FFA;
              border-radius: 4px;
              margin-left: 12px;
              text-transform: uppercase; }
            .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items li a svg {
              width: 20px;
              height: 20px;
              -ms-transform: rotate(0deg);
                  transform: rotate(0deg);
              right: 16px; }
              .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper ul.items li a svg path {
                fill: #165FFA; }
        .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page {
          left: 0;
          top: -56px;
          height: 100%;
          -ms-flex-pack: start;
              justify-content: flex-start;
          -ms-flex-align: start;
              align-items: flex-start;
          width: 100%;
          -ms-transform: translateX(-100%);
              transform: translateX(-100%);
          transition: all 0.3s;
          background-color: #FFFFFF;
          z-index: 9999;
          opacity: 0;
          display: none;
          height: calc(100% + 56px); }
          .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-head {
            -ms-flex-pack: justify;
                justify-content: space-between;
            -ms-flex-align: center;
                align-items: center;
            background-color: #104EF9;
            padding: 14px;
            width: 100%; }
            .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-head .device-name {
              -ms-flex-pack: start;
                  justify-content: flex-start;
              -ms-flex-align: center;
                  align-items: center; }
              .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-head .device-name svg {
                width: 24px;
                height: 24px;
                -ms-transform: rotate(180deg);
                    transform: rotate(180deg); }
                .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-head .device-name svg path {
                  fill: #FFFFFF; }
              .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-head .device-name p {
                color: #FFFFFF;
                margin-left: 8px;
                text-transform: uppercase; }
          .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper {
            width: 100%;
            -ms-flex-pack: start;
                justify-content: flex-start;
            -ms-flex-align: start;
                align-items: flex-start;
            background-color: #FFFFFF; }
            .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper ul {
              width: 100%; }
              .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper ul li {
                width: 100%; }
                .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper ul li a {
                  padding: 16px;
                  color: #272838;
                  text-decoration: none;
                  -ms-flex-pack: justify;
                      justify-content: space-between;
                  -ms-flex-align: center;
                      align-items: center;
                  width: 100%; }
                  .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper ul li a svg {
                    width: 20px;
                    height: 20px; }
                    .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page .sub-item-wrapper ul li a svg path {
                      fill: #165FFA; }
        .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper .mob-devices-wrapper .sub-item-page-anim {
          -ms-transform: translateX(0);
              transform: translateX(0);
          opacity: 1;
          display: block; }
      .navigation-wrapper .mob-navigation-wrapper .mob-pannel-wrapper hr {
        width: 91%;
        height: 1px;
        background-color: rgba(255, 255, 255, 0.4);
        margin: 8px auto; }
    .navigation-wrapper .mob-navigation-wrapper .mobile-nav-show {
      -ms-transform: translateY(0);
          transform: translateY(0);
      opacity: 1; }
  .navigation-wrapper .mob-nav-height {
    height: auto; }

.overview-wrapper {
  width: calc(100% - 64px);
  height: 100vh;
  padding: 24px;
  background-color: #FAFAFA;
  padding-top: 80px;
  margin-left: 64px; }
  @media (max-width: 767px) {
    .overview-wrapper {
      margin-left: 0;
      width: 100%;
      padding: 0px;
      padding-top: 64px;
      height: calc(100vh - 56px); } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .overview-wrapper {
      margin-left: 0;
      width: 100%;
      padding: 0px;
      padding-top: 64px; } }
  .overview-wrapper .select-options {
    width: 100%;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center; }
    @media (max-width: 767px) {
      .overview-wrapper .select-options {
        padding: 0 16px 0 16px; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .overview-wrapper .select-options {
        padding: 0 16px 0 16px; } }
    .overview-wrapper .select-options button {
      margin-right: 16px;
      transition: all 0.3s ease-in-out; }
  .overview-wrapper .content-wrapper {
    height: calc(100vh - 290px);
    overflow: hidden;
    box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
    border-radius: 9px;
    background-color: #FFFFFF;
    z-index: 9; }
    .overview-wrapper .content-wrapper .white-bg {
      top: 0;
      left: 0;
      width: 100%;
      height: 48px;
      background-color: #FFFFFF;
      border-radius: 8px;
      border-bottom-left-radius: 0px;
      border-bottom-right-radius: 0px;
      z-index: 99;
      border-bottom: 4px solid rgba(48, 72, 80, 0.05); }
    @media (max-width: 767px) {
      .overview-wrapper .content-wrapper {
        height: calc(100vh - 340px);
        margin: 0 16px 0 16px; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .overview-wrapper .content-wrapper {
        height: -webkit-max-content;
        height: max-content;
        overflow: inherit;
        margin: 0 16px 0 16px; } }
    .overview-wrapper .content-wrapper .table-wrapper {
      width: 100%;
      height: 100%;
      background-color: transparent;
      overflow: scroll; }
      .overview-wrapper .content-wrapper .table-wrapper::-webkit-scrollbar {
        width: 4px;
        height: 4px; }
      .overview-wrapper .content-wrapper .table-wrapper::-webkit-scrollbar-track {
        background-color: transparent;
        margin-top: 48px; }
      .overview-wrapper .content-wrapper .table-wrapper::-webkit-scrollbar-thumb {
        border-radius: 8px;
        background-color: rgba(48, 72, 80, 0.4); }
      .overview-wrapper .content-wrapper .table-wrapper table {
        background-color: transparent; }
    .overview-wrapper .content-wrapper .maps {
      width: 100%;
      height: 100%; }

.alarms-wrapper .main-head {
  color: #272838; }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .alarms-wrapper .main-head {
      padding-left: 16px; } }
.alarms-wrapper .data-togglers {
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  margin-top: 20px; }
  @media (max-width: 1200px) {
    .alarms-wrapper .data-togglers {
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-align: start;
          align-items: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start; } }
  @media (max-width: 767px) {
    .alarms-wrapper .data-togglers {
      padding: 0 16px;
      margin-top: 24px; } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .alarms-wrapper .data-togglers {
      padding: 0 16px; } }
  .alarms-wrapper .data-togglers .date-plus-time {
    width: auto;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-item-align: end;
        align-self: flex-end;
    -ms-flex-align: center;
        align-items: center; }
    @media (max-width: 1200px) {
      .alarms-wrapper .data-togglers .date-plus-time {
        width: 100%;
        position: relative;
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
        margin-top: 16px;
        -ms-flex-item-align: start;
            align-self: flex-start; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .alarms-wrapper .data-togglers .date-plus-time {
        width: 100%;
        position: relative;
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
        margin-top: 16px; } }
    .alarms-wrapper .data-togglers .date-plus-time > div {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: center;
          align-items: center; }
      @media (max-width: 1200px) {
        .alarms-wrapper .data-togglers .date-plus-time > div {
          width: -webkit-max-content;
          width: max-content; } }
      @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
        .alarms-wrapper .data-togglers .date-plus-time > div {
          width: -webkit-max-content;
          width: max-content; } }
      .alarms-wrapper .data-togglers .date-plus-time > div p {
        color: #165FFA;
        line-height: 18px;
        padding: 0 4px; }
        .alarms-wrapper .data-togglers .date-plus-time > div p:first-child {
          border-right: 1px solid #165FFA; }
        @media (max-width: 1200px) {
          .alarms-wrapper .data-togglers .date-plus-time > div p:first-child {
            border-right: none; }
          .alarms-wrapper .data-togglers .date-plus-time > div p:nth-child(2) {
            border-right: 1px solid #165FFA; } }
        @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
          .alarms-wrapper .data-togglers .date-plus-time > div p:first-child {
            border-right: none; }
          .alarms-wrapper .data-togglers .date-plus-time > div p:nth-child(2) {
            border-right: 1px solid #165FFA; } }
      .alarms-wrapper .data-togglers .date-plus-time > div p.mob-text {
        display: none; }
        @media (max-width: 1200px) {
          .alarms-wrapper .data-togglers .date-plus-time > div p.mob-text {
            display: -ms-flexbox;
            display: flex;
            color: #272838;
            width: 48px; } }
        @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
          .alarms-wrapper .data-togglers .date-plus-time > div p.mob-text {
            display: -ms-flexbox;
            display: flex;
            color: #272838;
            width: 48px; } }
    @media (max-width: 1200px) {
      .alarms-wrapper .data-togglers .date-plus-time .data:last-child {
        margin-top: 12px; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .alarms-wrapper .data-togglers .date-plus-time .data:last-child {
        margin-top: 12px; } }
    .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow {
      margin: 0 8px; }
      @media (max-width: 1200px) {
        .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow {
          width: -webkit-max-content;
          width: max-content;
          -ms-transform: rotate(90deg);
              transform: rotate(90deg);
          margin: 0;
          position: absolute;
          right: -12px;
          top: 12px; } }
      @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
        .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow {
          width: -webkit-max-content;
          width: max-content;
          -ms-transform: rotate(90deg);
              transform: rotate(90deg);
          margin: 0;
          position: absolute;
          right: -12px;
          top: 12px; } }
      .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow .date-back {
        -ms-transform: rotate(180deg);
            transform: rotate(180deg); }
        @media (max-width: 1200px) {
          .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow .date-back {
            margin-right: 11px; } }
        @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
          .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow .date-back {
            margin-right: 11px; } }
      .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow svg {
        cursor: pointer; }
        .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow svg path {
          fill: #272838; }
      .alarms-wrapper .data-togglers .date-plus-time .left-right-arrow svg.active path {
        fill: #165FFA; }
  .alarms-wrapper .data-togglers .filter-options {
    width: -webkit-max-content;
    width: max-content; }
    @media (max-width: 1200px) {
      .alarms-wrapper .data-togglers .filter-options {
        margin-top: 16px; } }
    .alarms-wrapper .data-togglers .filter-options button {
      margin-left: 16px; }
      @media (max-width: 1200px) {
        .alarms-wrapper .data-togglers .filter-options button {
          margin-left: 0;
          margin-right: 12px; } }
.alarms-wrapper .content-wrapper {
  height: calc(100vh - 230px); }
  @media (max-width: 767px) {
    .alarms-wrapper .content-wrapper {
      height: calc(100vh - 400px); } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .alarms-wrapper .content-wrapper {
      height: -webkit-max-content;
      height: max-content; } }

@media (max-width: 1200px) {
  .monitor-wrapper h2.main-head {
    padding-left: 16px; } }
.monitor-wrapper .content-wrapper {
  height: calc(100vh - 160px); }
  @media (max-width: 767px) {
    .monitor-wrapper .content-wrapper {
      height: calc(100vh - 200px); } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .monitor-wrapper .content-wrapper {
      height: -webkit-max-content;
      height: max-content; } }

.monitor-cb-detail-wrapper {
  width: calc(100% - 64px);
  height: 100vh;
  padding: 24px;
  background-color: #FAFAFA;
  padding-top: 80px;
  margin-left: 64px; }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .monitor-cb-detail-wrapper {
      margin-left: 0;
      width: 100%;
      padding: 0px;
      padding-top: 80px;
      height: auto; } }
  @media (max-width: 767px) {
    .monitor-cb-detail-wrapper {
      margin-left: 0;
      width: 100%;
      padding: 0px;
      padding-top: 80px;
      height: auto; } }
  .monitor-cb-detail-wrapper .top-controls {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-line-pack: center;
        align-content: center; }
    @media (max-width: 767px) {
      .monitor-cb-detail-wrapper .top-controls {
        padding: 0 16px; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .monitor-cb-detail-wrapper .top-controls {
        padding: 0 16px; } }
    .monitor-cb-detail-wrapper .top-controls .dual-options {
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      .monitor-cb-detail-wrapper .top-controls .dual-options button {
        margin-left: 16px; }
    .monitor-cb-detail-wrapper .top-controls button.drop svg {
      margin-left: 8px; }
      .monitor-cb-detail-wrapper .top-controls button.drop svg path {
        fill: #272838; }
    .monitor-cb-detail-wrapper .top-controls button.back svg {
      margin-right: 8px; }
  .monitor-cb-detail-wrapper .content-section-wrapper {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: start;
        align-items: flex-start;
    height: calc(100vh - 160px);
    overflow-y: scroll;
    margin-top: 16px; }
    @media (max-width: 767px) {
      .monitor-cb-detail-wrapper .content-section-wrapper {
        -ms-flex-direction: column;
            flex-direction: column;
        height: auto;
        overflow: auto;
        padding-bottom: 32px; } }
    .monitor-cb-detail-wrapper .content-section-wrapper .left-wrapper {
      width: 74.6%;
      margin-right: 16px;
      height: 100%; }
      @media (max-width: 767px) {
        .monitor-cb-detail-wrapper .content-section-wrapper .left-wrapper {
          width: 100%;
          height: auto;
          margin-right: 0;
          display: -ms-flexbox;
          display: flex;
          -ms-flex-direction: column;
              flex-direction: column;
          -ms-flex-pack: start;
              justify-content: flex-start;
          -ms-flex-align: center;
              align-items: center; } }
      .monitor-cb-detail-wrapper .content-section-wrapper .left-wrapper .cards-wrapper .cards-slider {
        grid-template-columns: repeat(4, 1fr); }
      .monitor-cb-detail-wrapper .content-section-wrapper .left-wrapper > div:not(:first-child) {
        margin-top: 16px; }
      @media (max-width: 767px) {
        .monitor-cb-detail-wrapper .content-section-wrapper .left-wrapper .graph-wrapper {
          margin-left: 0px;
          margin-right: 0px;
          width: calc(100% - 32px); } }
    .monitor-cb-detail-wrapper .content-section-wrapper .right-wrapper {
      height: 100%;
      width: 25.4%;
      -ms-flex-pack: end;
          justify-content: flex-end;
      position: -webkit-sticky;
      position: sticky;
      top: 0; }
      @media (max-width: 767px) {
        .monitor-cb-detail-wrapper .content-section-wrapper .right-wrapper {
          width: 100%;
          position: relative;
          top: inherit;
          height: auto;
          padding: 0 16px; } }
      .monitor-cb-detail-wrapper .content-section-wrapper .right-wrapper .long-card-wrapper {
        transition: all 0.5s;
        height: 100%; }
        @media (max-width: 767px) {
          .monitor-cb-detail-wrapper .content-section-wrapper .right-wrapper .long-card-wrapper {
            max-width: 100%;
            width: 100%;
            margin-top: 16px;
            height: 328px;
            overflow: hidden;
            transition: all 0.5s; } }

.inverter-detail-wrapper {
  width: calc(100% - 64px);
  height: 100vh;
  padding: 24px;
  background-color: #FAFAFA;
  padding-top: 80px;
  margin-left: 64px; }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .inverter-detail-wrapper {
      margin-left: 0;
      width: 100%;
      padding: 16px;
      padding-top: 80px;
      height: auto; } }
  @media (max-width: 767px) {
    .inverter-detail-wrapper {
      margin-left: 0;
      width: 100%;
      padding: 16px;
      padding-top: 80px;
      height: auto; } }
  .inverter-detail-wrapper .top-controls {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-line-pack: center;
        align-content: center; }
    .inverter-detail-wrapper .top-controls button.drop svg {
      margin-left: 8px; }
      .inverter-detail-wrapper .top-controls button.drop svg path {
        fill: #272838; }
    .inverter-detail-wrapper .top-controls button.back svg {
      margin-right: 8px; }
  .inverter-detail-wrapper .inverter-detail-wrapper2 {
    margin-top: 16px;
    height: calc(100vh - 160px); }
    @media (max-width: 767px) {
      .inverter-detail-wrapper .inverter-detail-wrapper2 {
        height: auto; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .inverter-detail-wrapper .inverter-detail-wrapper2 {
        height: auto; } }
    .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content {
      grid-template-columns: auto auto auto auto;
      column-gap: 16px;
      width: 100%;
      height: 100%; }
      @media (max-width: 1200px) {
        .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content {
          grid-template-columns: auto auto;
          row-gap: 16px; } }
      @media (max-width: 767px) {
        .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content {
          grid-template-columns: auto; } }
      .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details {
        padding: 0 16px 0px 16px;
        width: 100%;
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
        background-color: #FFFFFF;
        border: 1px solid rgba(16, 78, 249, 0.2);
        border-radius: 8px;
        box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
        height: 100%;
        overflow: scroll;
        position: relative;
        transition: all 0.5s; }
        @media (max-width: 767px) {
          .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details {
            max-height: 355px;
            padding: 0;
            overflow: hidden; } }
        .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .heading {
          width: 100%;
          background-color: #FFFFFF;
          position: -webkit-sticky;
          position: sticky;
          top: 0;
          padding-top: 16px;
          border-radius: 8px; }
          @media (max-width: 767px) {
            .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .heading {
              padding: 16px 16px 16px 16px; } }
          .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .heading h2 {
            color: #272838; }
        .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data {
          -ms-flex-pack: start;
              justify-content: flex-start;
          -ms-flex-align: start;
              align-items: flex-start;
          width: 100%;
          -ms-touch-action: auto;
              touch-action: auto; }
          @media (max-width: 767px) {
            .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data {
              padding: 0 16px 0px 16px; } }
          .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data .data-item {
            -ms-flex-pack: justify;
                justify-content: space-between;
            -ms-flex-align: center;
                align-items: center;
            padding: 8px 0 7px 0;
            border-bottom: 0.2px solid rgba(48, 72, 80, 0.4);
            width: 100%; }
            .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data .data-item p {
              font-family: "Sans-Regular";
              font-size: 14px;
              line-height: 24px;
              letter-spacing: 0.28px; }
              @media (max-width: 767px) {
                .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data .data-item p {
                  font-size: 12px;
                  line-height: 16px; } }
              .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .data .data-item p:first-child {
                max-width: 121px; }
        .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option {
          -ms-flex-pack: center;
              justify-content: center;
          -ms-flex-align: center;
              align-items: center;
          width: 100%;
          position: -webkit-sticky;
          position: sticky;
          bottom: 0;
          background-color: #FFFFFF;
          cursor: pointer;
          display: none;
          border-radius: 0 0 8px 8px; }
          @media (max-width: 767px) {
            .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option {
              display: -ms-flexbox;
              display: flex; } }
          .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option p {
            color: #389CFA;
            -ms-flex-pack: center;
                justify-content: center;
            -ms-flex-align: center;
                align-items: center;
            padding: 12px 0;
            width: 100%;
            height: 100%;
            background-color: #FFFFFF;
            text-align: center; }
            .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option p svg {
              margin-left: 8px;
              vertical-align: bottom; }
              .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option p svg path {
                fill: rgba(56, 156, 250, 0.4); }
          .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option p.show-less {
            background-color: #165FFA;
            color: #FFFFFF;
            display: none; }
            .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option p.show-less svg {
              -ms-transform: rotate(-180deg);
                  transform: rotate(-180deg); }
              .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details .more-option p.show-less svg path {
                fill: #FFFFFF; }
      .inverter-detail-wrapper .inverter-detail-wrapper2 .inverter-detail-wrapper-content .details-expand {
        max-height: 100%;
        height: 100%; }

.inverter-details {
  width: calc(100% - 64px);
  height: 100vh;
  padding: 24px;
  background-color: #FAFAFA;
  padding-top: 80px;
  margin-left: 64px; }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .inverter-details {
      margin-left: 0;
      width: 100%;
      padding: 0px;
      padding-top: 80px;
      height: auto; } }
  @media (max-width: 767px) {
    .inverter-details {
      margin-left: 0;
      width: 100%;
      padding: 0px;
      padding-top: 80px;
      height: auto; } }
  .inverter-details .top-controls {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-line-pack: center;
        align-content: center; }
    @media (max-width: 767px) {
      .inverter-details .top-controls {
        padding: 0 16px;
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-align: start;
            align-items: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
        position: relative; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .inverter-details .top-controls {
        padding: 0 16px; } }
    .inverter-details .top-controls .dual-options {
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      @media (max-width: 767px) {
        .inverter-details .top-controls .dual-options {
          margin-top: 16px;
          -ms-flex-pack: justify;
              justify-content: space-between;
          width: 100%; } }
      .inverter-details .top-controls .dual-options button {
        margin-left: 16px; }
        @media (max-width: 767px) {
          .inverter-details .top-controls .dual-options button {
            margin-left: 0; } }
      @media (max-width: 767px) {
        .inverter-details .top-controls .dual-options #settings {
          position: absolute;
          right: 16px;
          top: 0; } }
    .inverter-details .top-controls button.drop svg {
      margin-left: 8px; }
      .inverter-details .top-controls button.drop svg path {
        fill: #272838; }
    .inverter-details .top-controls button.back svg {
      margin-right: 8px; }
    .inverter-details .top-controls button.list svg {
      margin-right: 8px; }
  .inverter-details .content-section-wrapper {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: start;
        align-items: flex-start; }
    @media (max-width: 767px) {
      .inverter-details .content-section-wrapper {
        -ms-flex-align: center;
            align-items: center;
        padding-bottom: 32px; } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .inverter-details .content-section-wrapper {
        -ms-flex-align: center;
            align-items: center; } }
    .inverter-details .content-section-wrapper > div {
      margin-top: 16px; }
    .inverter-details .content-section-wrapper .middle-container {
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-align: start;
          align-items: flex-start;
      width: 100%; }
      @media (max-width: 767px) {
        .inverter-details .content-section-wrapper .middle-container {
          -ms-flex-direction: column;
              flex-direction: column;
          -ms-flex-pack: start;
              justify-content: flex-start;
          -ms-flex-align: center;
              align-items: center; } }
      @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
        .inverter-details .content-section-wrapper .middle-container {
          padding: 0 16px; } }
      .inverter-details .content-section-wrapper .middle-container .graph-wrapper {
        width: 67%;
        margin-right: 16px; }
        @media (max-width: 767px) {
          .inverter-details .content-section-wrapper .middle-container .graph-wrapper {
            width: calc(100% - 32px);
            margin-right: 0px;
            margin-bottom: 16px; } }
      .inverter-details .content-section-wrapper .middle-container .VI-value {
        width: 33%;
        background-color: #FFFFFF;
        height: 100%;
        border-radius: 8px;
        border: 1px solid rgba(16, 78, 249, 0.2);
        box-shadow: 0px 6px 18px rgba(48, 72, 80, 0.06);
        height: 304px;
        padding: 16px; }
        @media (max-width: 767px) {
          .inverter-details .content-section-wrapper .middle-container .VI-value {
            width: calc(100% - 32px); } }
        .inverter-details .content-section-wrapper .middle-container .VI-value table {
          width: 100%;
          height: auto;
          table-layout: auto; }
          .inverter-details .content-section-wrapper .middle-container .VI-value table tr th {
            text-align: left;
            font-family: "Sans-Bold";
            font-size: 20px;
            line-height: 32px;
            font-weight: inherit;
            vertical-align: baseline; }
            @media (max-width: 767px) {
              .inverter-details .content-section-wrapper .middle-container .VI-value table tr th {
                font-size: 18px; } }
          .inverter-details .content-section-wrapper .middle-container .VI-value table tr td {
            font-family: "Sans-Regular";
            font-size: 14px;
            line-height: 24px;
            letter-spacing: 0.28px; }
            @media (max-width: 767px) {
              .inverter-details .content-section-wrapper .middle-container .VI-value table tr td {
                font-size: 12px;
                line-height: 16px; } }
          .inverter-details .content-section-wrapper .middle-container .VI-value table tr.data td {
            padding-top: 48px; }
    @media (max-width: 767px) {
      .inverter-details .content-section-wrapper .graph-wrapper {
        width: calc(100% - 32px); } }
    @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
      .inverter-details .content-section-wrapper .graph-wrapper {
        width: calc(100% - 32px); } }

.mfm-wrapper .top-controls {
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-line-pack: center;
      align-content: center; }
  @media (max-width: 767px) {
    .mfm-wrapper .top-controls {
      padding: 0 16px;
      -ms-flex-direction: row;
          flex-direction: row; } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .mfm-wrapper .top-controls {
      padding: 0 16px; } }
  .mfm-wrapper .top-controls button.drop svg {
    margin-left: 8px; }
    .mfm-wrapper .top-controls button.drop svg path {
      fill: #272838; }
.mfm-wrapper .content-section-wrapper .middle-container .graph-wrapper {
  width: 33%; }
  @media (max-width: 767px) {
    .mfm-wrapper .content-section-wrapper .middle-container .graph-wrapper {
      width: calc(100% - 32px); } }
.mfm-wrapper .content-section-wrapper .middle-container .VI-value {
  width: 67%; }
  @media (max-width: 767px) {
    .mfm-wrapper .content-section-wrapper .middle-container .VI-value {
      width: calc(100% - 32px); } }
  .mfm-wrapper .content-section-wrapper .middle-container .VI-value table {
    table-layout: fixed;
    float: right;
    width: 90%; }
    @media (max-width: 767px) {
      .mfm-wrapper .content-section-wrapper .middle-container .VI-value table {
        table-layout: fixed;
        width: 100%;
        float: inherit; } }
    @media (max-width: 767px) {
      .mfm-wrapper .content-section-wrapper .middle-container .VI-value table tr.heading th:last-child {
        display: none; } }
    @media (max-width: 767px) {
      .mfm-wrapper .content-section-wrapper .middle-container .VI-value table tr.data td:last-child {
        display: none; } }

.ws-wrapper .top-controls {
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-line-pack: center;
      align-content: center; }
  @media (max-width: 767px) {
    .ws-wrapper .top-controls {
      padding: 0 16px;
      -ms-flex-direction: row;
          flex-direction: row; } }
  @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
    .ws-wrapper .top-controls {
      padding: 0 16px; } }
  .ws-wrapper .top-controls button.drop svg {
    margin-left: 8px; }
    .ws-wrapper .top-controls button.drop svg path {
      fill: #272838; }
.ws-wrapper .content-section-wrapper .middle-container .graph-wrapper {
  width: 50%; }
  .ws-wrapper .content-section-wrapper .middle-container .graph-wrapper:last-child {
    margin-right: 0;
    margin-bottom: 0; }
  @media (max-width: 767px) {
    .ws-wrapper .content-section-wrapper .middle-container .graph-wrapper {
      width: calc(100% - 32px); } }

.main-wrapper {
  width: calc(100% - 64px);
  height: 100vh;
  padding: 24px;
  background-color: #FAFAFA;
  padding-top: 80px;
  margin-left: 64px; }
  @media (max-width: 767px) {
    .main-wrapper {
      margin-left: 0;
      width: 100%;
      padding: 16px;
      padding-top: 64px;
      height: auto; } }
  .main-wrapper h2.main-head {
    color: #272838; }

.contract-wrapper .top-input {
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: center;
      align-items: center; }
  .contract-wrapper .top-input .input-wrapper {
    max-width: 472px;
    width: 100%; }
  .contract-wrapper .top-input button {
    margin-left: 16px; }
.contract-wrapper .detail-wrapper {
  margin-top: 48px; }
  @media (max-width: 767px) {
    .contract-wrapper .detail-wrapper {
      margin-top: 24px; } }
  .contract-wrapper .detail-wrapper .tabs-wrapper {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: center;
        align-items: center;
    width: 100%;
    /* Style the buttons that are used to open the tab content */
    /* Change background color of buttons on hover */
    /* Create an active/current tablink class */ }
    @media (max-width: 767px) {
      .contract-wrapper .detail-wrapper .tabs-wrapper {
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-align: start;
            align-items: flex-start; } }
    .contract-wrapper .detail-wrapper .tabs-wrapper .tab {
      overflow: hidden;
      border: none;
      background-color: transparent; }
    .contract-wrapper .detail-wrapper .tabs-wrapper .action-buttons {
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      @media (max-width: 767px) {
        .contract-wrapper .detail-wrapper .tabs-wrapper .action-buttons {
          margin-top: 16px; } }
      .contract-wrapper .detail-wrapper .tabs-wrapper .action-buttons button {
        margin-left: 16px; }
        @media (max-width: 767px) {
          .contract-wrapper .detail-wrapper .tabs-wrapper .action-buttons button {
            padding: 3px;
            min-height: 32px;
            max-height: 32px;
            width: 32px;
            margin-left: 0;
            margin-right: 16px; } }
      .contract-wrapper .detail-wrapper .tabs-wrapper .action-buttons button.site-show {
        display: none; }
    .contract-wrapper .detail-wrapper .tabs-wrapper .tab button {
      background-color: inherit;
      float: left;
      border-bottom: 2px solid rgba(48, 72, 80, 0.05);
      outline: none;
      cursor: pointer;
      padding: 0px 12px;
      transition: 0.3s;
      font-family: "Sans-Medium";
      font-size: 14px;
      line-height: 24px;
      letter-spacing: 0.28px;
      padding-bottom: 4px;
      color: rgba(48, 72, 80, 0.6); }
      @media (max-width: 767px) {
        .contract-wrapper .detail-wrapper .tabs-wrapper .tab button {
          font-size: 12px;
          line-height: 16px;
          padding: 0 7px; } }
    .contract-wrapper .detail-wrapper .tabs-wrapper .tab button:hover {
      background-color: transparent;
      color: #165FFA; }
    .contract-wrapper .detail-wrapper .tabs-wrapper .tab button.active {
      background-color: transparent;
      border-bottom: 2px solid #165FFA;
      color: #165FFA; }
  .contract-wrapper .detail-wrapper .content-wrapper {
    margin-top: 32px;
    /* Style the tab content */ }
    @media (max-width: 767px) {
      .contract-wrapper .detail-wrapper .content-wrapper {
        margin-top: 24px; } }
    .contract-wrapper .detail-wrapper .content-wrapper .tabcontent {
      display: none;
      border: none;
      height: calc(100vh - 290px); }
      @media (max-width: 767px) {
        .contract-wrapper .detail-wrapper .content-wrapper .tabcontent {
          height: 100%; } }
    .contract-wrapper .detail-wrapper .content-wrapper #one {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-item-align: start;
          align-self: flex-start; }
      @media (max-width: 767px) {
        .contract-wrapper .detail-wrapper .content-wrapper #one {
          -ms-flex-direction: column;
              flex-direction: column; } }
      .contract-wrapper .detail-wrapper .content-wrapper #one .lft {
        width: 43.8%;
        padding-right: 16px; }
        @media (max-width: 767px) {
          .contract-wrapper .detail-wrapper .content-wrapper #one .lft {
            width: 100%;
            padding-right: 0; } }
        .contract-wrapper .detail-wrapper .content-wrapper #one .lft .date-wrapper {
          grid-template-columns: repeat(2, 1fr);
          column-gap: 36px;
          margin-top: 16px;
          -ms-flex-align: end;
              align-items: end; }
        .contract-wrapper .detail-wrapper .content-wrapper #one .lft h3.table-head {
          color: #272838;
          margin-top: 32px; }
          @media (max-width: 767px) {
            .contract-wrapper .detail-wrapper .content-wrapper #one .lft h3.table-head {
              margin-top: 24px; } }
        .contract-wrapper .detail-wrapper .content-wrapper #one .lft .contract-parameters {
          margin-top: 32px;
          position: relative;
          margin-top: 16px; }
          .contract-wrapper .detail-wrapper .content-wrapper #one .lft .contract-parameters .white-bg {
            top: 0;
            left: 0;
            width: 100%;
            height: 48px;
            background-color: #FFFFFF;
            border-radius: 8px;
            border-bottom-left-radius: 0px;
            border-bottom-right-radius: 0px;
            z-index: 99;
            border-bottom: 4px solid rgba(48, 72, 80, 0.05); }
          .contract-wrapper .detail-wrapper .content-wrapper #one .lft .contract-parameters .table-wrapper {
            height: 250px;
            border-radius: 8px;
            overflow-y: scroll; }
      .contract-wrapper .detail-wrapper .content-wrapper #one .rgt {
        width: 56.2%; }
        @media (max-width: 767px) {
          .contract-wrapper .detail-wrapper .content-wrapper #one .rgt {
            width: 100%;
            margin-top: 24px; } }
        .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper {
          width: 100%;
          background-color: #FFFFFF;
          border-radius: 8px;
          -ms-flex-pack: start;
              justify-content: flex-start;
          -ms-flex-align: start;
              align-items: flex-start;
          min-height: 496px;
          overflow-y: scroll; }
          @media (max-width: 767px) {
            .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper {
              min-height: 263px;
              height: 263px; } }
          .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .head {
            border-bottom: 1px solid rgba(48, 72, 80, 0.05);
            width: 100%;
            position: -webkit-sticky;
            position: sticky;
            top: 0;
            border-top-left-radius: 8px;
            border-top-right-radius: 8px; }
            .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .head h3 {
              color: #272838;
              padding: 24px;
              background-color: #FFFFFF; }
          .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items {
            border-bottom: 1px solid rgba(48, 72, 80, 0.05);
            -ms-flex-pack: justify;
                justify-content: space-between;
            -ms-flex-align: center;
                align-items: center;
            padding: 12px 24px 12px 56px;
            position: relative;
            width: 100%; }
            .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items h4 {
              color: #272838;
              position: relative; }
              .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items h4::before {
                content: url("../../build/images/icons/document.svg");
                position: absolute;
                left: 0;
                margin-left: -32px;
                height: 24px; }
            .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items .action-buttons {
              height: 24px;
              -ms-flex-pack: end;
                  justify-content: flex-end;
              -ms-flex-align: center;
                  align-items: center; }
              .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items .action-buttons svg {
                margin-left: 8px;
                cursor: pointer; }
                .contract-wrapper .detail-wrapper .content-wrapper #one .rgt .parameters-wrapper .items .action-buttons svg path {
                  fill: rgba(48, 72, 80, 0.6); }
    .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper {
      width: 100%;
      position: relative;
      height: calc(100vh - 320px);
      overflow: hidden;
      box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
      border-radius: 9px;
      background-color: #FFFFFF;
      z-index: 9; }
      @media (max-width: 767px) {
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper {
          height: calc(100vh - 340px); } }
      @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper {
          height: 100%; } }
      .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper {
        width: 100%;
        height: 100%;
        background-color: transparent;
        overflow: scroll; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper::-webkit-scrollbar {
          width: 4px;
          height: 4px; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper::-webkit-scrollbar-track {
          background-color: transparent;
          margin-top: 48px; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper::-webkit-scrollbar-thumb {
          border-radius: 8px;
          background-color: rgba(48, 72, 80, 0.4); }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper table {
          background-color: transparent; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper .main-table-basic th:nth-child(1) {
          width: 80px; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper .main-table-basic th:nth-child(2) {
          width: 180px; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper .main-table-basic th:nth-child(3) {
          width: 177px; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper .main-table-basic th:nth-child(4) {
          width: 173px; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper .main-table-basic th:nth-child(5) {
          width: 310px; }
        .contract-wrapper .detail-wrapper .content-wrapper #two .handover-wrapper .table-wrapper .main-table-basic th:nth-child(6) {
          width: 163px; }
    .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper {
      width: 100%;
      position: relative;
      height: calc(100vh - 320px);
      overflow: hidden;
      box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
      border-radius: 9px;
      background-color: #FFFFFF;
      z-index: 9; }
      @media (max-width: 767px) {
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper {
          height: calc(100vh - 340px); } }
      @media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper {
          height: 100%; } }
      .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper {
        width: 100%;
        height: 100%;
        background-color: transparent;
        overflow: scroll; }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper::-webkit-scrollbar {
          width: 4px;
          height: 4px; }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper::-webkit-scrollbar-track {
          background-color: transparent;
          margin-top: 48px; }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper::-webkit-scrollbar-thumb {
          border-radius: 8px;
          background-color: rgba(48, 72, 80, 0.4); }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper table {
          background-color: transparent; }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper .main-table-basic th:nth-child(1) {
          width: 80px; }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper .main-table-basic th:nth-child(2) {
          width: 288px; }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper .main-table-basic th:nth-child(3) {
          width: 306px; }
        .contract-wrapper .detail-wrapper .content-wrapper #three .site-wrapper .table-wrapper .main-table-basic th:nth-child(4) {
          width: 287px; }

.project-resources-wrapper .top-head {
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center; }
  @media (max-width: 767px) {
    .project-resources-wrapper .top-head {
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-align: start;
          align-items: flex-start; } }
  .project-resources-wrapper .top-head .action-buttons {
    -ms-flex-pack: end;
        justify-content: flex-end;
    -ms-flex-align: center;
        align-items: center; }
    @media (max-width: 767px) {
      .project-resources-wrapper .top-head .action-buttons {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -ms-flex-pack: start;
            justify-content: flex-start; } }
    .project-resources-wrapper .top-head .action-buttons button {
      margin-left: 16px; }
      @media (max-width: 767px) {
        .project-resources-wrapper .top-head .action-buttons button {
          padding: 3px;
          min-height: 32px;
          max-height: 32px;
          width: 32px;
          margin-left: 0;
          margin-right: 16px;
          margin-top: 16px; } }
.project-resources-wrapper .content-wrapper {
  height: calc(100vh - 180px);
  overflow: hidden;
  box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
  border-radius: 9px;
  background-color: #FFFFFF;
  z-index: 9;
  margin-top: 28px; }
  @media (max-width: 767px) {
    .project-resources-wrapper .content-wrapper {
      height: calc(100vh - 300px); } }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(1) {
    width: 80px; }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(2) {
    width: 149px; }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(3) {
    width: 139px; }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(4) {
    width: 158px; }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(5) {
    width: 191px; }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(6) {
    width: 152px; }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(7) {
    width: 138px; }
  .project-resources-wrapper .content-wrapper .main-table-basic th:nth-child(8) {
    width: 204px; }

.user-tracking-wrapper .top-head .input-section {
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: center;
      align-items: center;
  margin-top: 8px; }
  @media (max-width: 767px) {
    .user-tracking-wrapper .top-head .input-section {
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-align: start;
          align-items: flex-start;
      margin-top: 16px; } }
  .user-tracking-wrapper .top-head .input-section .select-wrapper {
    max-width: 319px; }
    @media (max-width: 767px) {
      .user-tracking-wrapper .top-head .input-section .select-wrapper {
        max-width: 100%; } }
  .user-tracking-wrapper .top-head .input-section .date-wrapper {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center;
    margin-left: 16px; }
    @media (max-width: 767px) {
      .user-tracking-wrapper .top-head .input-section .date-wrapper {
        -ms-flex-align: start;
            align-items: flex-start;
        margin-left: 0;
        margin-top: 16px;
        width: 100%; } }
    .user-tracking-wrapper .top-head .input-section .date-wrapper .input-wrapper {
      max-width: 208px; }
      @media (max-width: 767px) {
        .user-tracking-wrapper .top-head .input-section .date-wrapper .input-wrapper {
          max-width: 100%; } }
      .user-tracking-wrapper .top-head .input-section .date-wrapper .input-wrapper:first-child {
        margin-right: 16px; }
  .user-tracking-wrapper .top-head .input-section .reload {
    margin-left: 16px; }
    @media (max-width: 767px) {
      .user-tracking-wrapper .top-head .input-section .reload {
        margin-left: 0;
        margin-top: 16px; } }
.user-tracking-wrapper .content-wrapper {
  height: calc(100vh - 230px);
  overflow: hidden;
  box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
  border-radius: 9px;
  background-color: #FFFFFF;
  z-index: 9;
  margin-top: 28px; }
  @media (max-width: 767px) {
    .user-tracking-wrapper .content-wrapper {
      height: calc(100vh - 370px); } }
  .user-tracking-wrapper .content-wrapper .maps {
    width: 100%;
    height: 100%;
    display: block !important; }

.inventory-wrapper .top-head {
  margin-top: 30px;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center; }
  @media (max-width: 767px) {
    .inventory-wrapper .top-head {
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-align: start;
          align-items: flex-start;
      margin-top: 24px; } }
  .inventory-wrapper .top-head .input-wrapper {
    max-width: 416px; }
    @media (max-width: 767px) {
      .inventory-wrapper .top-head .input-wrapper {
        max-width: 100%; } }
  .inventory-wrapper .top-head .action-buttons {
    -ms-flex-pack: end;
        justify-content: flex-end;
    -ms-flex-align: center;
        align-items: center; }
    @media (max-width: 767px) {
      .inventory-wrapper .top-head .action-buttons {
        -ms-flex-pack: start;
            justify-content: flex-start;
        margin-top: 16px; } }
    .inventory-wrapper .top-head .action-buttons button {
      margin-left: 16px; }
      @media (max-width: 767px) {
        .inventory-wrapper .top-head .action-buttons button {
          padding: 3px;
          min-height: 32px;
          max-height: 32px;
          margin-left: 0;
          margin-right: 16px; } }
.inventory-wrapper .content-wrapper {
  height: calc(100vh - 280px);
  overflow: hidden;
  box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
  border-radius: 9px;
  background-color: #FFFFFF;
  z-index: 9;
  margin-top: 28px; }
  @media (max-width: 767px) {
    .inventory-wrapper .content-wrapper {
      height: calc(100vh - 340px); } }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(1) {
    width: 80px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(2) {
    width: 137px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(3) {
    width: 168px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(4) {
    width: 123px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(5) {
    width: 119px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(6) {
    width: 186px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(7) {
    width: 135px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(8) {
    width: 192px; }
  .inventory-wrapper .content-wrapper .main-table-basic th:nth-child(9) {
    width: 105px; }

.inventory-calendar-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 100;
  transition: all 0.5s;
  display: none; }
  @media (max-width: 767px) {
    .inventory-calendar-wrapper {
      top: 112px;
      -ms-flex-align: start;
          align-items: flex-start;
      height: calc(100vh - 112px);
      overflow: scroll; } }
  .inventory-calendar-wrapper .activity {
    background-color: #FAFAFA;
    border-radius: 8px;
    padding: 30px 24px;
    max-width: 876px;
    width: 100%;
    transition: all 0.3s; }
    @media (max-width: 767px) {
      .inventory-calendar-wrapper .activity {
        padding: 30px 16px;
        border-radius: 0;
        max-width: 100%; } }
    .inventory-calendar-wrapper .activity .head {
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-align: center;
          align-items: center; }
      .inventory-calendar-wrapper .activity .head svg {
        cursor: pointer; }
        .inventory-calendar-wrapper .activity .head svg path {
          fill: #272838; }
    .inventory-calendar-wrapper .activity .detail-wrapper {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: end;
          align-items: flex-end;
      margin-top: 30px; }
      @media (max-width: 767px) {
        .inventory-calendar-wrapper .activity .detail-wrapper {
          -ms-flex-direction: column;
              flex-direction: column;
          -ms-flex-align: start;
              align-items: flex-start;
          margin-top: 10px; } }
      .inventory-calendar-wrapper .activity .detail-wrapper .input-wrapper {
        max-width: 224px;
        margin-right: 16px; }
        @media (max-width: 767px) {
          .inventory-calendar-wrapper .activity .detail-wrapper .input-wrapper {
            max-width: 100%;
            margin-top: 16px; } }
        @media (max-width: 767px) {
          .inventory-calendar-wrapper .activity .detail-wrapper .input-wrapper {
            margin-right: 0; } }
      .inventory-calendar-wrapper .activity .detail-wrapper .inventory-wrapper:last-of-type {
        margin-right: 0; }
      .inventory-calendar-wrapper .activity .detail-wrapper .action-buttons {
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: center;
            align-items: center;
        margin-bottom: 5px;
        margin-left: 16px; }
        @media (max-width: 767px) {
          .inventory-calendar-wrapper .activity .detail-wrapper .action-buttons {
            margin-bottom: 0;
            margin-left: 0;
            -ms-flex-align: start;
                align-items: flex-start;
            margin-top: 16px; } }
        .inventory-calendar-wrapper .activity .detail-wrapper .action-buttons button:first-child {
          margin-right: 16px; }
        @media (max-width: 767px) {
          .inventory-calendar-wrapper .activity .detail-wrapper .action-buttons button {
            padding: 3px;
            min-height: 32px;
            max-height: 32px;
            margin-left: 0; } }
    .inventory-calendar-wrapper .activity .content-wrapper {
      height: 248px;
      overflow: hidden;
      box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
      border-radius: 9px;
      background-color: #FFFFFF;
      z-index: 9;
      margin-top: 28px; }
      @media (max-width: 767px) {
        .inventory-calendar-wrapper .activity .content-wrapper {
          margin-top: 24px; } }
    .inventory-calendar-wrapper .activity .save-wrapper {
      margin-top: 24px;
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      @media (max-width: 767px) {
        .inventory-calendar-wrapper .activity .save-wrapper {
          margin-top: 16px;
          -ms-flex-pack: start;
              justify-content: flex-start; } }
      .inventory-calendar-wrapper .activity .save-wrapper button {
        position: relative;
        min-width: auto; }
        .inventory-calendar-wrapper .activity .save-wrapper button::after {
          content: url("../../build/images/icons/right-chevron.svg");
          width: 24px;
          height: 24px;
          margin-left: 8px; }

.work-order-wrapper {
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  position: relative; }
  .work-order-wrapper .left-wrapper {
    width: 100%;
    transition: all 0.3s; }
  .work-order-wrapper .min-left-wrapper {
    width: 70%;
    transition: all 0.3s; }
  .work-order-wrapper .right-wrapper {
    width: 0;
    background-color: #FFFFFF;
    height: calc(100% - 56px);
    padding: 24px;
    box-shadow: 0px 8px 32px rgba(48, 72, 80, 0.16), 0px 16px 64px rgba(48, 72, 80, 0.08);
    position: absolute;
    top: 56px;
    right: 0;
    opacity: 0;
    display: block;
    transition: all 0.3s; }
    .work-order-wrapper .right-wrapper .work-order-popup .heading {
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-align: center;
          align-items: center; }
      .work-order-wrapper .right-wrapper .work-order-popup .heading h4 {
        color: #272838; }
      .work-order-wrapper .right-wrapper .work-order-popup .heading svg {
        cursor: pointer; }
        .work-order-wrapper .right-wrapper .work-order-popup .heading svg path {
          fill: #272838; }
    .work-order-wrapper .right-wrapper .work-order-popup .details {
      margin-top: 16px; }
      .work-order-wrapper .right-wrapper .work-order-popup .details .details-data {
        padding: 16px 0px 16px 0;
        border-bottom: 1px solid rgba(48, 72, 80, 0.4);
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: center;
            align-items: center; }
        .work-order-wrapper .right-wrapper .work-order-popup .details .details-data .preventive {
          background-color: #00CFDE;
          border-radius: 2px;
          height: 100%;
          width: 8px;
          min-width: 8px;
          min-height: 48px; }
        .work-order-wrapper .right-wrapper .work-order-popup .details .details-data .critical {
          background-color: #FF6464;
          border-radius: 2px;
          height: 100%;
          width: 8px;
          min-width: 8px;
          min-height: 48px; }
        .work-order-wrapper .right-wrapper .work-order-popup .details .details-data h4 {
          font-family: "Sans-Regular";
          color: #272838;
          margin-left: 16px; }
  .work-order-wrapper .show-right-wrapper {
    width: 400px;
    opacity: 1;
    transition: all 0.3s; }
  .work-order-wrapper .top-head {
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: center;
        align-items: center; }
    @media (max-width: 767px) {
      .work-order-wrapper .top-head {
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-align: start;
            align-items: flex-start; } }
    .work-order-wrapper .top-head .action-buttons {
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: center;
          align-items: center; }
      @media (max-width: 767px) {
        .work-order-wrapper .top-head .action-buttons {
          width: 100%;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
          -ms-flex-align: start;
              align-items: flex-start;
          -ms-flex-pack: start;
              justify-content: flex-start;
          margin-top: 8px; } }
      .work-order-wrapper .top-head .action-buttons button {
        margin-left: 16px; }
        @media (max-width: 767px) {
          .work-order-wrapper .top-head .action-buttons button {
            padding: 3px;
            min-height: 32px;
            max-height: 32px;
            margin-left: 0;
            margin-right: 16px;
            margin-top: 8px; } }
        .work-order-wrapper .top-head .action-buttons button svg.cal {
          display: none; }
        .work-order-wrapper .top-head .action-buttons button svg.tab {
          display: -ms-flexbox;
          display: flex; }
  .work-order-wrapper .content-wrapper {
    margin-top: 28px;
    background-color: #FFFFFF;
    border-radius: 8px;
    padding: 16px;
    height: calc(100vh - 180px);
    overflow: hidden;
    box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
    z-index: 9; }
    @media (max-width: 767px) {
      .work-order-wrapper .content-wrapper {
        height: calc(100vh - 300px); } }
    .work-order-wrapper .content-wrapper .calendar-wrapper {
      height: 100%; }
      .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel {
        -ms-flex-pack: justify;
            justify-content: space-between;
        -ms-flex-align: center;
            align-items: center; }
        @media (max-width: 767px) {
          .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel {
            -ms-flex-direction: column;
                flex-direction: column;
            -ms-flex-align: start;
                align-items: flex-start;
            position: relative; } }
        @media (max-width: 767px) {
          .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel h2 {
            font-weight: 700; } }
        .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps {
          -ms-flex-pack: center;
              justify-content: center;
          -ms-flex-align: center;
              align-items: center; }
          @media (max-width: 767px) {
            .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps {
              position: absolute;
              right: 0;
              top: 4px; } }
          .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps .cal-back {
            -ms-transform: rotate(180deg);
                transform: rotate(180deg); }
          .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps p {
            margin: 0 16px; }
          .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps svg {
            cursor: pointer; }
            .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps svg:hover path {
              fill: #272838; }
          .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .calendar-steps .cal-back path {
            fill: rgba(48, 72, 80, 0.6); }
        @media (max-width: 767px) {
          .work-order-wrapper .content-wrapper .calendar-wrapper .action-panel .multiple-button-wrapper {
            margin-top: 16px; } }
  .work-order-wrapper .search-wrapper {
    width: 464px;
    background-color: #FAFAFA;
    height: calc(100% - 56px);
    padding: 24px;
    box-shadow: 0px 8px 32px rgba(48, 72, 80, 0.16), 0px 16px 64px rgba(48, 72, 80, 0.08);
    position: absolute;
    top: 56px;
    opacity: 0;
    overflow: scroll;
    display: block;
    transition: all 0.3s;
    z-index: 9; }
    .work-order-wrapper .search-wrapper .search-content {
      height: 100%; }
      .work-order-wrapper .search-wrapper .search-content .heading {
        -ms-flex-pack: justify;
            justify-content: space-between;
        -ms-flex-align: center;
            align-items: center; }
      .work-order-wrapper .search-wrapper .search-content form .input-wrapper {
        margin-top: 16px; }
      .work-order-wrapper .search-wrapper .search-content form .action-buttons {
        -ms-flex-pack: end;
            justify-content: flex-end;
        -ms-flex-align: center;
            align-items: center;
        margin-top: 16px; }
        .work-order-wrapper .search-wrapper .search-content form .action-buttons button {
          margin-left: 16px; }
  .work-order-wrapper .show-search-wrapper {
    max-width: 464px;
    width: 100%;
    opacity: 1;
    transition: all 0.3s;
    right: 0; }

.main-calendar {
  width: 100%;
  margin-top: 16px;
  height: 100%; }
  .main-calendar .head-wrapper {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center; }
    .main-calendar .head-wrapper .cal-head {
      width: 184px;
      background-color: #82EB9F;
      border-radius: 8px;
      padding: 8px;
      text-align: center;
      margin-right: 1px; }
      .main-calendar .head-wrapper .cal-head p {
        color: #272838; }
        .main-calendar .head-wrapper .cal-head p span {
          color: #272838; }
  .main-calendar .dates-wrapper {
    margin-top: 3px;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: start;
        align-items: flex-start;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    overflow: scroll;
    height: calc(100% - 100px); }
    .main-calendar .dates-wrapper .cal-date {
      width: 184px;
      border-radius: 8px;
      border: 1px solid rgba(16, 78, 249, 0.2);
      margin-right: 1px;
      margin-top: 1px;
      padding: 8px;
      box-sizing: border-box;
      height: 120px;
      cursor: pointer; }
      @media (max-width: 767px) {
        .main-calendar .dates-wrapper .cal-date {
          width: 72px; } }
      .main-calendar .dates-wrapper .cal-date .date-top {
        -ms-flex-pack: justify;
            justify-content: space-between;
        -ms-flex-align: center;
            align-items: center;
        width: 100%; }
        .main-calendar .dates-wrapper .cal-date .date-top p {
          padding: 4px;
          background-color: #1EB971;
          color: #FFFFFF;
          border-radius: 8px; }
        .main-calendar .dates-wrapper .cal-date .date-top h2 {
          color: #272838;
          right: 0;
          top: 0; }
      .main-calendar .dates-wrapper .cal-date .cal-details {
        -ms-flex-pack: start;
            justify-content: flex-start;
        -ms-flex-align: center;
            align-items: center;
        margin-top: 8px; }
        .main-calendar .dates-wrapper .cal-date .cal-details:first-child {
          margin-top: 16px; }
        .main-calendar .dates-wrapper .cal-date .cal-details .preventive,
        .main-calendar .dates-wrapper .cal-date .cal-details .critical {
          width: 8px;
          height: 8px;
          min-width: 8px;
          background-color: #00CFDE;
          border-radius: 50%; }
        .main-calendar .dates-wrapper .cal-date .cal-details .critical {
          background-color: #FF6464; }
        .main-calendar .dates-wrapper .cal-date .cal-details p {
          margin-left: 8px;
          color: #272838; }
      .main-calendar .dates-wrapper .cal-date .more-option {
        color: rgba(48, 72, 80, 0.6);
        margin-top: 8px; }
    .main-calendar .dates-wrapper .cal-date.active {
      background: linear-gradient(315deg, #165FFA 0%, #008FF6 100%);
      box-shadow: 0px 8px 32px rgba(48, 72, 80, 0.16), 0px 16px 64px rgba(48, 72, 80, 0.08);
      border: transparent; }
      .main-calendar .dates-wrapper .cal-date.active .date-top p {
        background-color: #FFFFFF;
        color: #165FFA; }
      .main-calendar .dates-wrapper .cal-date.active .date-top h2 {
        color: #FFFFFF; }
      .main-calendar .dates-wrapper .cal-date.active .cal-details p {
        color: #FFFFFF; }
      .main-calendar .dates-wrapper .cal-date.active .more-option {
        color: #FFFFFF; }

#year-view.main-calendar .dates-wrapper {
  height: calc(100% - 40px); }
  #year-view.main-calendar .dates-wrapper .cal-date {
    width: 323px;
    height: 213px; }
    #year-view.main-calendar .dates-wrapper .cal-date .date-top {
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: start;
          align-items: flex-start; }
      #year-view.main-calendar .dates-wrapper .cal-date .date-top h2 {
        position: relative;
        top: inherit;
        right: inherit; }
      #year-view.main-calendar .dates-wrapper .cal-date .date-top p {
        margin-top: 28px; }
    #year-view.main-calendar .dates-wrapper .cal-date .cal-details {
      margin-top: 16px; }

#week-view.main-calendar .dates-wrapper {
  height: auto;
  margin-top: 16px; }
  #week-view.main-calendar .dates-wrapper .cal-date {
    width: 184px;
    height: 56px;
    padding: 16px;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center; }
    #week-view.main-calendar .dates-wrapper .cal-date .cal-details {
      margin-top: 0px; }
      #week-view.main-calendar .dates-wrapper .cal-date .cal-details p {
        white-space: nowrap; }

#day-view.main-calendar {
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  height: calc(100% - 40px);
  overflow: scroll; }
  #day-view.main-calendar .time {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: start;
        align-items: flex-start;
    margin-right: 16px; }
    #day-view.main-calendar .time h4 {
      padding-top: 16px;
      height: 128px;
      max-height: 128px; }
  #day-view.main-calendar .dates-wrapper {
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: start;
        align-items: flex-start;
    height: auto; }
    #day-view.main-calendar .dates-wrapper .cal-date {
      width: 320px;
      height: 128px;
      padding: 16px;
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
      margin-left: 16px; }
      #day-view.main-calendar .dates-wrapper .cal-date:not(:first-child) {
        margin-top: 16px; }
      #day-view.main-calendar .dates-wrapper .cal-date h4 {
        color: #272838; }
        #day-view.main-calendar .dates-wrapper .cal-date h4 span {
          color: #272838;
          font-family: "Sans-Regular"; }
      #day-view.main-calendar .dates-wrapper .cal-date .cal-details {
        margin-top: 16px; }

#month-view.main-calendar .dates-wrapper {
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: start;
      align-items: flex-start;
  width: 100%;
  height: calc(100% - 40px);
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap; }
  #month-view.main-calendar .dates-wrapper .cal-date {
    width: 100%;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center;
    max-height: 64px;
    padding: 20px 16px;
    margin-top: 0;
    margin-right: 0; }
    #month-view.main-calendar .dates-wrapper .cal-date:not(:first-child) {
      margin-top: 8px; }
    #month-view.main-calendar .dates-wrapper .cal-date h4 {
      color: #272838; }
    #month-view.main-calendar .dates-wrapper .cal-date p {
      padding: 4px;
      background-color: #1EB971;
      color: #FFFFFF;
      border-radius: 8px;
      margin-left: 32px; }

.work-order-details .heading {
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center; }
  @media (max-width: 767px) {
    .work-order-details .heading {
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: start;
          align-items: flex-start; } }
  .work-order-details .heading .actions-buttons {
    -ms-flex-pack: end;
        justify-content: flex-end;
    -ms-flex-align: center;
        align-items: center; }
    @media (max-width: 767px) {
      .work-order-details .heading .actions-buttons {
        margin-top: 16px; } }
    .work-order-details .heading .actions-buttons button {
      margin-left: 16px; }
      @media (max-width: 767px) {
        .work-order-details .heading .actions-buttons button {
          margin-left: 0;
          margin-right: 16px;
          padding: 4px;
          max-height: 32px;
          min-height: 32px;
          width: 32px; } }
.work-order-details .switch-tab {
  width: 100%;
  -ms-flex-pack: center;
      justify-content: center;
  margin-top: 20px;
  display: none; }
  @media (max-width: 767px) {
    .work-order-details .switch-tab {
      display: -ms-flexbox;
      display: flex; } }
  .work-order-details .switch-tab p {
    width: 50%;
    color: #272838;
    border-bottom: 2px solid rgba(48, 72, 80, 0.05);
    text-align: center;
    padding-bottom: 4px; }
  .work-order-details .switch-tab p.active {
    border-bottom: 2px solid #165FFA; }
.work-order-details .content-wrapper {
  margin-top: 12px;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: start;
      align-items: flex-start;
  height: calc(100% - 70px); }
  .work-order-details .content-wrapper .details {
    max-width: 458px;
    width: 100%;
    background-color: #FAFAFA;
    padding: 0 26px 16px 16px;
    height: 100%;
    overflow: scroll; }
    @media (max-width: 767px) {
      .work-order-details .content-wrapper .details {
        max-width: 100%;
        padding: 0px; } }
    .work-order-details .content-wrapper .details form > div:not(:first-child) {
      margin-top: 16px; }
    .work-order-details .content-wrapper .details form .liked-work-orders {
      width: 100%;
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
      margin-top: 16px; }
      .work-order-details .content-wrapper .details form .liked-work-orders button {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
            align-items: center;
        -ms-flex-pack: start;
            justify-content: flex-start; }
        .work-order-details .content-wrapper .details form .liked-work-orders button::after {
          content: url("../../build/images/icons/add.svg");
          margin-left: 16px; }
    @media (max-width: 767px) {
      .work-order-details .content-wrapper .details form .double-input.custom-check-input {
        padding-top: 32px; } }
    .work-order-details .content-wrapper .details form .double-input .custom-checkbox {
      position: absolute;
      top: 5px;
      right: 0;
      /* The container */
      /* Hide the browser's default checkbox */
      /* Create a custom checkbox */
      /* On mouse-over, add a grey background color */
      /* When the checkbox is checked, add a blue background */
      /* Create the checkmark/indicator (hidden when not checked) */
      /* Show the checkmark when checked */
      /* Style the checkmark/indicator */ }
      @media (max-width: 767px) {
        .work-order-details .content-wrapper .details form .double-input .custom-checkbox {
          position: absolute;
          top: 0;
          left: 0; } }
      .work-order-details .content-wrapper .details form .double-input .custom-checkbox .container {
        display: block;
        position: relative;
        padding-left: 24px;
        margin-bottom: 0px;
        cursor: pointer;
        font-family: "Sans-Bold";
        font-size: 14px;
        line-height: 16px;
        letter-spacing: 0.28px;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none; }
        @media (max-width: 767px) {
          .work-order-details .content-wrapper .details form .double-input .custom-checkbox .container {
            font-size: 12px;
            line-height: 16px; } }
      .work-order-details .content-wrapper .details form .double-input .custom-checkbox .container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0; }
      .work-order-details .content-wrapper .details form .double-input .custom-checkbox .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 18px;
        width: 18px;
        background-color: transparent;
        border: 2px solid #389CFA; }
      .work-order-details .content-wrapper .details form .double-input .custom-checkbox .container input:checked ~ .checkmark {
        background-color: transparent; }
      .work-order-details .content-wrapper .details form .double-input .custom-checkbox .checkmark:after {
        content: "";
        position: absolute;
        display: none; }
      .work-order-details .content-wrapper .details form .double-input .custom-checkbox .container input:checked ~ .checkmark:after {
        display: block; }
      .work-order-details .content-wrapper .details form .double-input .custom-checkbox .container .checkmark:after {
        left: 5px;
        top: 0px;
        width: 3px;
        height: 9px;
        border: solid #389CFA;
        border-width: 0 2px 2px 0;
        -ms-transform: rotate(45deg);
        transform: rotate(45deg); }
  .work-order-details .content-wrapper .preview {
    background-color: #FFFFFF;
    width: calc(100% - 458px);
    height: 100%;
    border-radius: 8px;
    padding: 24px; }
    @media (max-width: 767px) {
      .work-order-details .content-wrapper .preview {
        background-color: transparent;
        width: 100%;
        padding: 0px;
        display: none; } }
    .work-order-details .content-wrapper .preview .action-tabs {
      -ms-flex-pack: start;
          justify-content: flex-start;
      -ms-flex-align: center;
          align-items: center;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
      .work-order-details .content-wrapper .preview .action-tabs button {
        margin-right: 16px;
        margin-bottom: 16px;
        cursor: pointer; }
        @media (max-width: 767px) {
          .work-order-details .content-wrapper .preview .action-tabs button {
            margin-top: 16px;
            margin-bottom: 0; } }
    .work-order-details .content-wrapper .preview .content-wrapper {
      position: relative;
      margin-top: 0; }
      @media (max-width: 767px) {
        .work-order-details .content-wrapper .preview .content-wrapper {
          margin-top: 24px; } }
      .work-order-details .content-wrapper .preview .content-wrapper .main-table-basic th:nth-child(1) {
        width: 158px; }
      .work-order-details .content-wrapper .preview .content-wrapper .main-table-basic th:nth-child(2) {
        width: 217px; }
      .work-order-details .content-wrapper .preview .content-wrapper .main-table-basic th:nth-child(3) {
        width: 169px; }
      .work-order-details .content-wrapper .preview .content-wrapper .main-table-basic th:nth-child(4) {
        width: 163px; }

@media (max-width: 767px) {
  .work-order-inverter {
    padding-left: 0;
    padding-right: 0; } }
@media (max-width: 767px) {
  .work-order-inverter .top-head {
    padding-left: 16px;
    padding-right: 16px; } }
@media (max-width: 767px) {
  .work-order-inverter .content-wrapper {
    overflow: scroll;
    padding-right: 0;
    padding-left: 0;
    box-shadow: none;
    height: calc(100vh - 268px); } }
@media (max-width: 767px) {
  .work-order-inverter .content-wrapper .calendar-wrapper .action-panel {
    margin-left: 16px;
    margin-right: 16px; } }
.work-order-inverter .content-wrapper .cards-details {
  width: 100%;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: start;
      align-items: flex-start;
  margin-top: 18px; }
  @media (max-width: 767px) {
    .work-order-inverter .content-wrapper .cards-details {
      -ms-flex-direction: column;
          flex-direction: column;
      margin-top: 24px; } }
  .work-order-inverter .content-wrapper .cards-details .cards-wrapper {
    width: 51%;
    margin-right: 16px;
    -ms-flex-positive: 1;
        flex-grow: 1; }
    @media (max-width: 767px) {
      .work-order-inverter .content-wrapper .cards-details .cards-wrapper {
        width: 100%;
        margin-right: 0; } }
    .work-order-inverter .content-wrapper .cards-details .cards-wrapper .overview-card {
      height: 132px; }
      @media (max-width: 767px) {
        .work-order-inverter .content-wrapper .cards-details .cards-wrapper .overview-card {
          height: 112px; } }
      .work-order-inverter .content-wrapper .cards-details .cards-wrapper .overview-card .card-name h4 {
        color: #165FFA; }
  .work-order-inverter .content-wrapper .cards-details .plain-details {
    border-radius: 8px; }
    @media (max-width: 767px) {
      .work-order-inverter .content-wrapper .cards-details .plain-details {
        min-width: 100%;
        max-width: 100%;
        width: 100%;
        margin-top: 24px;
        overflow: scroll;
        padding-bottom: 2px;
        padding-left: 16px; } }
    .work-order-inverter .content-wrapper .cards-details .plain-details-wrapper {
      padding: 16px;
      border-radius: 8px;
      width: 624px;
      height: 100%;
      border: 1px solid rgba(16, 78, 249, 0.2);
      box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08); }
      .work-order-inverter .content-wrapper .cards-details .plain-details-wrapper table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 4px; }
        .work-order-inverter .content-wrapper .cards-details .plain-details-wrapper table tr th {
          font-family: "Sans-Bold";
          font-size: 20px;
          line-height: 32px;
          font-weight: inherit;
          color: #272838;
          text-align: center; }
          @media (max-width: 767px) {
            .work-order-inverter .content-wrapper .cards-details .plain-details-wrapper table tr th {
              font-size: 18px; } }
        .work-order-inverter .content-wrapper .cards-details .plain-details-wrapper table tr td {
          font-family: "Sans-Regular";
          font-size: 14px;
          line-height: 24px;
          letter-spacing: 0.28px;
          color: #272838;
          text-align: center; }
          @media (max-width: 767px) {
            .work-order-inverter .content-wrapper .cards-details .plain-details-wrapper table tr td {
              font-size: 12px;
              line-height: 16px; } }
.work-order-inverter .content-wrapper .new-table-wrappers {
  position: relative;
  height: 264px;
  overflow: scroll;
  box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08);
  margin-top: 24px;
  border-radius: 9px;
  background-color: #FFFFFF;
  z-index: 9; }
  @media (max-width: 767px) {
    .work-order-inverter .content-wrapper .new-table-wrappers {
      margin-left: 16px; } }
  .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type {
    margin-top: 16px; }
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(1) {
      width: 171px; }
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(2) {
      width: 176px; }
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(3),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(4),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(5),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(6),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(7),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(8),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(9),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(10),
    .work-order-inverter .content-wrapper .new-table-wrappers:last-of-type table tr th:nth-child(11) {
      width: 100px; }

.htv-reports-wrapper .content-wrapper .history-tree-view-block .heading {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: justify;
      justify-content: space-between; }
  .htv-reports-wrapper .content-wrapper .history-tree-view-block .heading button {
    cursor: pointer;
    background: #FFFFFF; }
.htv-reports-wrapper .content-wrapper .history-tree-view-block .content-wrapper-tree {
  height: calc(100% - 35px);
  margin-top: 16px; }

@media screen and (orientation: landscape) and (min-width: 480px) and (max-width: 1024px) {
  .vendors-details {
    margin-left: 0px !important;
    width: 100% !important;
    height: calc(100vh - 56px) !important; } }
@media (max-width: 767px) {
  .vendors-details .heading .actions-buttons {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-align: start;
        align-items: flex-start;
    -ms-flex-pack: start;
        justify-content: flex-start; } }
@media (max-width: 767px) {
  .vendors-details .heading .actions-buttons button {
    margin-top: 8px; } }
.vendors-details .content-wrapper {
  height: calc(100% - 55px); }
  .vendors-details .content-wrapper .details {
    overflow-y: scroll;
    padding: 16px; }
    @media (min-width: 768px) and (max-width: 1023px) {
      .vendors-details .content-wrapper .details {
        max-width: 50%; } }
    @media (max-width: 767px) {
      .vendors-details .content-wrapper .details {
        padding: 0px; } }
    .vendors-details .content-wrapper .details::-webkit-scrollbar {
      width: 4px;
      height: 4px; }
    .vendors-details .content-wrapper .details::-webkit-scrollbar-track {
      background-color: transparent; }
    .vendors-details .content-wrapper .details::-webkit-scrollbar-thumb {
      border-radius: 8px;
      background-color: rgba(48, 72, 80, 0.4); }
    .vendors-details .content-wrapper .details .vendors-block .vendors-tab {
      padding: 16px;
      border-radius: 8px;
      cursor: pointer; }
    .vendors-details .content-wrapper .details .vendors-block hr {
      border-bottom: 1px solid rgba(48, 72, 80, 0.4);
      width: 96%;
      float: right; }
    .vendors-details .content-wrapper .details .vendors-block.active .vendors-tab {
      cursor: pointer;
      padding: 16px;
      border-radius: 8px;
      background-color: #C4E2FF; }
    .vendors-details .content-wrapper .details .vendors-block.active hr {
      display: none; }
  .vendors-details .content-wrapper .preview {
    padding: 14px 0px 24px 8px;
    overflow: hidden; }
    @media (min-width: 768px) and (max-width: 1023px) {
      .vendors-details .content-wrapper .preview {
        width: 50%; } }
    @media (max-width: 767px) {
      .vendors-details .content-wrapper .preview {
        background-color: #FFFFFF;
        padding: 16px 16px 32px 16px; } }
    .vendors-details .content-wrapper .preview .preview-content-wrapper {
      height: calc(100% - 70px);
      overflow-y: scroll;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      padding: 0px 0px 0px 0px;
      width: 100%; }
      @media (max-width: 480px) {
        .vendors-details .content-wrapper .preview .preview-content-wrapper {
          padding: 0px; } }
      .vendors-details .content-wrapper .preview .preview-content-wrapper::-webkit-scrollbar {
        width: 4px;
        height: 4px; }
      .vendors-details .content-wrapper .preview .preview-content-wrapper::-webkit-scrollbar-track {
        background-color: transparent; }
      .vendors-details .content-wrapper .preview .preview-content-wrapper::-webkit-scrollbar-thumb {
        border-radius: 8px;
        background-color: rgba(48, 72, 80, 0.4); }
      .vendors-details .content-wrapper .preview .preview-content-wrapper .Cleaners-cards {
        margin: 16px 8px 8px 16px;
        height: 156px;
        width: 100%;
        max-width: 207px;
        background-color: #FFFFFF;
        box-shadow: 0px 2px 8px rgba(48, 72, 80, 0.08), 0px 4px 16px rgba(48, 72, 80, 0.08); }
        @media (max-width: 767px) {
          .vendors-details .content-wrapper .preview .preview-content-wrapper .Cleaners-cards {
            max-width: 100%;
            height: auto;
            margin: 16px; } }
        .vendors-details .content-wrapper .preview .preview-content-wrapper .Cleaners-cards .name-n-address {
          padding: 16px 16px 31px 16px; }
          .vendors-details .content-wrapper .preview .preview-content-wrapper .Cleaners-cards .name-n-address .address {
            margin-top: 16px; }
        .vendors-details .content-wrapper .preview .preview-content-wrapper .Cleaners-cards .actions-box {
          -ms-flex-pack: end;
              justify-content: flex-end;
          border-top: 1px solid rgba(16, 78, 249, 0.2); }
          .vendors-details .content-wrapper .preview .preview-content-wrapper .Cleaners-cards .actions-box button {
            background: #FFFFFF;
            height: 44px !important;
            cursor: pointer; }
    .vendors-details .content-wrapper .preview .add-button {
      padding: 22px 24px 0px 0px;
      -ms-flex-pack: end;
          justify-content: flex-end;
      -ms-flex-align: end;
          align-items: flex-end; }
      @media (max-width: 480px) {
        .vendors-details .content-wrapper .preview .add-button {
          padding: 0px 16px 0px 0px; } }
      .vendors-details .content-wrapper .preview .add-button button {
        max-width: 59px;
        max-height: 48px;
        width: 59px;
        height: 48px; }