@charset "utf-8";
@import url('ember/ember.css');
@import url("niceselect/nice-select.css");
@import url("colorbox/colorbox.css");
@import url("jquery-ui.min.css");
@import url("select/select2.min.css");
@import url("multiselect/multi-select.dist.css");
@import url("fontawesome/fontAwesome.css");

@font-face {
    font-family: "digital-7";
    src: url(fonts/digital-7.ttf);
}
:root{
 --color-red: #d71b3a;
 --color-orange: #f29423;
 --color-blue: rgb(13, 102, 208);
 --color-green: rgb(18, 128, 92);
 --color-gray: #575855;
}
@media (prefers-reduced-motion: no-preference) {
 :root {scroll-behavior: smooth}
}
* { margin: 0; font-family: 'ember', sans-serif; }
html {
 min-height: 100vh;
}
body { min-height: 100%;
background-color: #f3f3f3;
}
body { font-size: 12px; line-height: 1.5; color: rgb(34, 43, 84); text-rendering: optimizeLegibility; }
body.rightSide { padding-right: 400px }
.loginBackground {
 background-image: url("../img/bg/loginBg.jpg");
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;
 position: relative;
 min-height: 100vh;
 width: 100%;
 font-weight: normal;
 -webkit-font-smoothing: antialiased;
 -webkit-text-size-adjust: 100%;
 -ms-text-size-adjust: 100%;
 -webkit-font-feature-settings: "kern" 1;
 -moz-font-feature-settings: "kern" 1;
 -webkit-tap-highlight-color: transparent;
 -webkit-text-size-adjust: 100%;
}
.loginInside {
 position: absolute;
 left: 5vw;
 bottom: 5vh;
 color: #fff;
}
.loginInside h1 {
 font-weight: 700;
 font-size: 10rem;
}
.loginInside p {
 font-weight: 400;
 font-size: 2rem;
}
.loginForm {
 padding: 10vh 3rem 5vh 3rem;
}
.loginForm h1{
 font-size: 2rem;
}
.loginLogo {
 margin-bottom: 2rem;
 background-position: left center;
 background-repeat: no-repeat;
 background-image: url("../img/logo/logo-dark.png");
 background-size: contain;
 height: 60px;
}
.pageContainer {
 padding-left: 70px;
 transition: .2s;
}
#header {
 border-bottom: 1px solid rgba(224, 224, 224, 0.7);
 padding: 10px;
 background: #fff;
 box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;
 position: fixed;
 z-index: 65;
 left: 0;
 right: 0;
 top: 0;
 height: 60px;
}
#main {
 padding-top: 60px;
}
#pageHeader{
 padding: 1rem .75rem 0 .75rem;
 background: rgb(250, 251, 252);
 box-shadow: rgb(234, 236, 239) 0px -1px 0px 0px inset;
}
#pageHeader h1{
 margin: 0 0 1rem 0;
 padding: 0;
 font-size: 1.2rem;
 color: var(--bs-dark-purple);
}
#pageContent{
 background: #fff;
 padding: 1rem 0;
}

#mainLogo {
 height: 35px;
 background-position: left center;
 background-repeat: no-repeat;
 background-image: url("../img/logo/logo-dark.png");
 background-size: contain;
 display: inline-block;
 text-indent: -3500px;
 width: 70px;
 margin-left: 70px;
}
#sideNav {
 width: 280px;
 background-color: #2b303b;
 z-index: 1000;
 left: -210px;
 position: fixed;
 bottom: 0;
 top: 0;
 right: auto;
 -webkit-transition: -webkit-transform 400ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
 -moz-transition: -moz-transform 400ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
 -o-transition: -o-transform 400ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
 transition: transform 400ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
 -webkit-backface-visibility: hidden;
 -webkit-perspective: 1000;
}
#sideNavContainer {
 position: relative;
 height: 100vh;
 overflow: auto;
}
#sideNav .logoSide {
 background: #272b35;
 border-bottom: solid 1px #232730;
 padding: 1rem 1rem 1rem 3rem;
 position: sticky;
 top: 0;
 box-sizing: border-box;
 height: 60px;
 z-index: 6;
}

.bs-callout {
 border-radius: 4px;
 padding: 15px 40px 15px 15px;
 margin-bottom: 10px;
 text-align: left;
 background-color: #fff;
 letter-spacing: -.3px;
 color: #272b35;
 position: relative;
 box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 6px 0px inset;
}

.bs-callout::before, .bs-callout-info::before, .bs-callout-warning::before, .bs-callout-success::before, .bs-callout-tutorial::before {
 display: block;
 position: absolute;
 content: "";
 width: 18px;
 height: 18px;
 top: 50%;
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
 right: 20px;
 background-repeat: no-repeat;
 background-size: contain;
}
.bs-callout-danger {
 border: solid 1px var(--color-red);
}


.bs-callout-warning {
 border: solid 1px var(--color-orange);
}

.bs-callout-info {
 border: solid 1px var(--color-blue);
}

.bs-callout-tutorial {
 border: solid 1px var(--color-gray);
}

.bs-callout-success {
 border: solid 1px var(--color-green);
}
.bs-callout-danger::before {
 background-image: url(../img/icons/danger.svg);
}

.bs-callout-info::before {
 background-image: url(../img/icons/help.svg);
}

.bs-callout-tutorial::before {
 background-image: url(../img/icons/tutorial.svg);
}

.bs-callout-warning::before {
 background-image: url(../img/icons/warning.svg);
}

.bs-callout-success::before {
 background-image: url(../img/icons/success.svg);
}
#sideNav .logoSide .logo {
 height: 35px;
 background-position: left center;
 background-repeat: no-repeat;
 background-image: url("../img/logo/logo.png");
 background-size: contain;
 display: inline-block;
 text-indent: -3500px;
 width: 70px;
 margin-left: -2rem;
 transition: 700ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
 transition-delay: .15s;
 transform-origin: center;
 transform: rotateY(270deg);
 opacity: 0;
}
body.sidebar-visible #sideNav{
 transform: translate(210px);
}
body.sidebar-visible #sideNav .logoSide .logo {
 margin-left: 0;
 transform: rotateY(360deg);
 opacity: 1;
}
#menuOpener, .headerBtn {
 line-height: 20px;
 padding: 2.5px 0;
 font-size: 20px;
 color: #575855;
 width: auto;
 border-radius: 2px;
 text-align: center;
 display: inline-block;
}
#menuCloser {
 display: inline-block;
 padding-top: .4rem;
 padding-bottom: .4rem;
 padding-left: 1rem;
 padding-right: 28px;
 font-size: 1.5rem;
 color: #929aac;
}
.sideMenuContainer {
 padding: 0;
 margin-bottom: 5rem;
 max-height: calc(100vh - 60px);
 overflow: auto;
}
.sideMenu {
 padding: 0;
 margin: 0;
 list-style: none;
 display: block;
}
.sideMenu li {
 display: block;
 padding: 0;
 margin: 0;
 list-style: none;
}
.sideMenu li a{
 padding: 0.85rem 1rem 0.85rem 3rem;
 flex: 1;
 color: #929aac;
 text-decoration: none;
 font-size: 1.4rem;
 display: block;
 font-weight: 400;
 letter-spacing: -.25px;
 position: relative;
 transition: .2s;
}
.sideMenu li a span.description{
 font-size: .7rem;
 display: block;
 padding-top: .13rem;
 opacity: .7;
}
.sideMenu li a span.menuIcon {
 padding: 0.7rem 1rem 0.7rem 1rem;
 font-size: 1.4rem;
 color: #d6d6d6;
 width: 8rem;
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
 text-align: center;
 box-sizing: border-box;
}
.sideMenu>li:not(:first-child) {
 border-top: solid 1px #393e48;
}
.sideMenu>li:not(:last-child) {
 border-bottom: solid 1px #232730;
}
.sideMenu li:hover>a, .sideMenu li:hover .menuIcon {
 color: #fff;
}
.sideMenu li.hasMenu>a::after
{
 display: inline-block;
 background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
 font-weight: normal;

 background-size: 12px 9px;
 content: "";
 width: 12px;
 height: 9px;
 text-shadow: none;
 -webkit-transition: all 0.12s ease;
 transition: all 0.12s ease;
 position: absolute;
 right:8.6rem;
 top: 50%;
 transform: translateY(-50%) rotate(90deg);
 opacity: .4;
}

.sideMenu li.hasMenu.opened a::after {
 transform: translateY(-50%)  rotate(0deg);
}
body.sidebar-visible #sideNav .sideMenu li.hasMenu a::after {
 right: 6rem;
}
.sideMenu>li>ul {
 background: #21252d;
 height: 0;
 margin: 0;
 list-style: none;
 padding: 0;
 overflow: hidden;
 transition: 450ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
}
.sideMenu li.opened>ul {
 height: auto;
 padding: 1rem;
}
.sideMenu li ul li {
 padding: 0;
 margin: 0;
 opacity: 0;
 list-style: none;
 transition: 450ms linear;
 transition-delay: 150ms;
 position: relative;
}
.sideMenu li ul li ul {
 background: #2b303b;
 padding: 0;
 border-radius: 3px;
 margin-left: 2rem;
 overflow: hidden;
 height: 0;
 transition: 450ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
 position: relative;
}
.sideMenu li ul li ul::after {
 width: 0;
 height: 0;
 border-style: solid;
 border-width: 0 6px 6px 6px;
 border-color: transparent transparent #2b303b transparent;
 display: inline-block;
 content: "";
 position: absolute;
 top: -6px;
 z-index: 56;
 left: 10px;
}
.sideMenu li ul li.opened>ul {
 height: auto;
 overflow: visible;
 padding: 0;
}
.sideMenu li ul li ul li{
 padding: 0;
 margin: 0;
}
.sideMenu li ul li ul li a{
 padding: .5rem 1rem;
 margin: 0;
 border-top:solid 1px rgba(255,255,255,.1);
 border-bottom:solid 1px rgba(0,0,0,.1);
 font-size: .8rem;
}
.sideMenu li ul li ul li:first-child>a{
 border-top: none!important;
 border-radius: 3px 3px 0 0;
}
.sideMenu li ul li ul li:last-child>a{
 border-bottom: none!important;
 border-radius: 0 0 3px 3px;
}
.sideMenu li ul li ul li a:hover{
 background: rgba(255,255,255,.1);
}
.sideMenu li ul li:hover>ul {

}
.sideMenu li ul li.divider {
 border-bottom: solid 1px #393e48;
 margin-left: -1rem;
 padding-top: 1rem;
 margin-right: -1rem;
 margin-bottom: 1rem;
}
.sideMenu li ul li:nth-child(2) {
 transition-delay:200ms;
}
.sideMenu li ul li:nth-child(3) {
 transition-delay:250ms;
}
.sideMenu li ul li:nth-child(4) {
 transition-delay:300ms;
}
.sideMenu li ul li:nth-child(5) {
 transition-delay:350ms;
}
.sideMenu li ul li:nth-child(6) {
 transition-delay:400ms;
}
.sideMenu li.opened ul li {
 opacity: 1;
}
.sideMenu li ul li a{
 font-size: 1.4rem;
 padding: .5rem 0 .5rem 2.3rem;
 font-weight: 400;
 position: relative;
 opacity: .6;
}
.sideMenu li ul li.sm a{
 font-size: .8rem;
 padding: .3rem 0 .3rem 2.3rem;
}
.sideMenu li ul li a:hover {
 opacity: 1;
}
.sideMenu li ul li a span.subMenuIcon{
 display: inline-block;
 position: absolute;
 top: 50%;
 background: #2b303b;
 transform: translateY(-50%);
 width: 3rem;
 height: 3rem;
 padding-top: 5px;
 padding-bottom: 5px;
 font-size: 1rem;
 right: 2rem;
 text-align: center;
 border-radius: 2px;
}

.clear { clear: both }

a { color: #c0392b; text-decoration: none; }

.form-error { background-color: #fff1b5; margin-top: 5px; font-size: 10px; font-weight: 400; display: block; padding: 7px; font-family: 'ember', Arial, serif; border-radius: 3px; }

.help-block { margin-top: 5px; font-family: 'ember', arial, serif; font-size: 12px; background-color: #fcf8e3; border-radius: 3px; padding: 10px; color: #8a6d3b }

.container { padding-left: 15px; padding-right: 15px; }

.loginBackground { position: absolute; left: 0; right: 0; bottom: 0; top: 0; z-index: 3; background-image: url(../img/loginbg.jpg); background-repeat: no-repeat; background-position: center center; background-color: #21343d }

.loginContainer { position: absolute; left: 60%; z-index: 7; top: 0; right: 5%; padding: 150px 40px 40px 40px; bottom: 0; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+38,0+74 */ background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 38%, rgba(255, 255, 255, 0) 74%, rgba(255, 255, 255, 0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 38%, rgba(255, 255, 255, 0) 74%, rgba(255, 255, 255, 0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 38%, rgba(255, 255, 255, 0) 74%, rgba(255, 255, 255, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=0); /* IE6-9 */
}

.logoContainerCenter { background-image: url(../img/logo-colored.png); background-position: left bottom; background-repeat: no-repeat; height: 60px; margin-bottom: 50px; background-size: contain; }

.colorLabel { display: block; padding: 3px 8px; border-radius: 2px; font-weight: bold; color: #fff; white-space: nowrap }

.row { display: block; margin-left: -5px; margin-right: -5px; }

.scrollable-menu { height: auto; width: 100px !important; min-width: 100px !important; max-height: 200px; overflow-x: hidden; }

.imgAvatar { display: inline-block; width: 100px; height: 100px; margin: 1em auto; background-size: cover; background-repeat: no-repeat; background-position: center center; -webkit-border-radius: 99em; -moz-border-radius: 99em; border-radius: 99em; border: 5px solid #eee; box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3); }

.miniAvatar { display: inline-block; width: 40px; height: 40px; margin: 0 auto; background-size: cover; background-repeat: no-repeat; background-position: center center; -webkit-border-radius: 99em; -moz-border-radius: 99em; border-radius: 99em; border: 2px solid #eee; box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3); }

.col12 { width: 100%; }

.col11 { width: 91.66666667%; }

.col10 { width: 83.33333333%; }

.col9 { width: 75%; }

.col8 { width: 66.66666667%; }

.col7 { width: 58.33333333%; }

.col6 { width: 50%; }

.col5 { width: 41.66666667%; }

.col4 { width: 33.33333333%; }

.col3 { width: 25%; }

.col2 { width: 16.66666667%; }

.col1 { width: 8.33333333%; }

thead { display: table-header-group !important; }

tfoot { display: table-header-group !important; }

.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 { float: left; box-sizing: border-box; padding-left: 5px; padding-right: 5px; }

.formGroup { padding-top: 15px }

.formGroup.first { padding-top: 0 }

.formGroup label { display: block; margin-bottom: 3px; color: #363636; font-weight: bold; font-size: 12px;
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
}

.formGroup input, .pvtUi select, .formGroup select, .formGroup textarea { resize: none; -webkit-box-sizing: border-box; box-sizing: border-box !important; width: 100%; display: block;
 box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset;

    border: 1px solid #c8c8c8;

    color: #777;
    padding: 9px; border-radius: 3px; font-family: 'ember', Arial, serif; margin: 0; vertical-align: middle; -webkit-tap-highlight-color: transparent; font-size: 12px; font-weight: normal; height: 34px; line-height: 34px; outline: none; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

.formGroup textarea { height: auto !important; line-height: 15px !important }

.formGroup input:hover, .formGroup select:hover, .formGroup textarea:hover, .searchBar input:hover { border-color: #fbca00; }

.formGroup select option { margin: 0; padding: 0; line-height: 1; }

.formGroup input:focus, .formGroup select:focus, .formGroup textarea:focus, .searchBar input:focus { border-color: #ef7f1a; background-color: #f5f5f5 }

.formGroup select {
 padding: 0 29px 0 9px;
 display: block;
 vertical-align: middle;
background-color: #fff;background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");background-repeat: no-repeat;background-position: right .75rem center;background-size: 16px 12px;-webkit-appearance: none;-moz-appearance: none;appearance: none
}

.formGroup input[type=checkbox] { display: inline-block !important; margin-right: 5px; width: auto !important; height: auto !important }

label.checkbox { margin-right: 4px; cursor: pointer; border: solid 1px #e8e8e8; padding: 9px; color: #737373; border-radius: 3px; display: block; float: left; box-sizing: border-box !important; }

label.checkbox small { font-weight: normal }

.margRight, .mRight { margin-right: 10px }

.margBottom { margin-bottom: 10px !important }

.btn { display: inline-block; border: none; background: #B5181B; color: #fff; font-family: 'ember', serif; font-weight: 700; padding: 7px 14px; font-size: 14px; cursor: pointer; border-radius: 3px; }

.btn-mini { padding: 2px 7px; font-size: 12px; }

.btn:hover { background-color: #1c1c1c }

.btn-success { background: #5CA240 }

.btn-info { background: #50A2BB }

.btn-warning { background: #E1BF48 }

.pageBaslik { margin-bottom: 25px; }

.adrBox { line-height: 17px}

.pageBaslik h1 { margin: 0; font-size: 20px; font-weight: 900; color: #1c1c1c; }

.pageBaslik h2 { font-weight: 300; color: #949494; font-size: 15px; margin: 0; }

.topTitle { font-size: 17px; font-weight: 700; color: #1c1c1c; line-height: 16px; padding-top: 4px; padding-right: 20px; position: relative; float: left; }

.topTitle span { display: block; font-size: 12px; color: #6B6B6B; font-weight: 300 }

.color-line { background: #f7f9fa; height: 6px; background-image: -webkit-linear-gradient(left, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%); background-image: -moz-linear-gradient(left, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%); background-image: -ms-linear-gradient(left, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%); background-image: linear-gradient(to right, #34495e, #34495e 25%, #9b59b6 25%, #9b59b6 35%, #3498db 35%, #3498db 45%, #62cb31 45%, #62cb31 55%, #ffb606 55%, #ffb606 65%, #e67e22 65%, #e67e22 75%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%); background-size: 100% 6px; background-position: 50% 100%; background-repeat: no-repeat; }

#topMenu, #topMenu li { display: block; margin: 0; padding: 0; list-style-type: none; }

#topMenu { float: left; }

#rightMenu { float: left; margin-left: 10px; }

#rightMenu, #rightMenu li { display: block; margin: 0; padding: 0; list-style-type: none; }

#topMenu li, #rightMenu li { float: left; position: relative; }

#topMenu li a, #rightMenu li a { display: block; padding: 0px 13px; line-height: 60px; box-sizing: border-box; font-size: 16px; font-weight: 700; color: #737373; text-decoration: none; margin-right: 1px; }

#topMenu li:hover > a, #rightMenu li:hover > a { background-color: #B5181B; color: #fff; }

#topMenu li a i, #rightMenu li a i { color: #B5181B }

#topMenu li:hover > a i, #rightMenu li:hover > a i { color: #fff }

#topMenu li ul, #rightMenu li ul { display: none; position: absolute; z-index: 767; top: 100%; left: 0; min-width: 150px; white-space: nowrap; background-color: #B5181B; padding: 15px; box-sizing: border-box; }

#topMenu li ul li, #rightMenu li ul li { float: none }

#topMenu li ul li a, #rightMenu li ul li a { border-left: none !important; line-height: 15px; border-right: none !important; border-top: none !important; background: none !important; color: #fff; border-bottom: solid 1px rgba(255, 255, 255, .1); padding-left: 0; padding-right: 0; font-size: 14px; font-weight: 300; padding-bottom: 10px; padding-top: 10px; }

#topMenu li ul li a:hover, #rightMenu li ul li a:hover { text-decoration: underline }

#topMenu li:hover > ul, #rightMenu li:hover > ul { display: block; }

.alert { padding: 10px; margin-bottom: 10px; font-size: 12px; box-shadow: 0 2px 4px rgba(0, 0, 0, .15); border-left-style: solid; border-left-width: 3px; border-radius: 2px; }

.alert-success { background-color: #dff0d8; border-color: #d6e9c6; color: #3c763d }

.alert-info { background-color: #d9edf7; border-color: #bce8f1; color: #31708f }

.alert-warning { background-color: #fcf8e3; border-color: #faebcc; color: #8a6d3b }

.alert-danger { background-color: #f2dede; border-color: #ebccd1; color: #a94442 }

#footer { margin-top: 10px; padding-top: 10px; padding-bottom: 10px; border-top: solid 1px rgba(0, 0, 0, .1); font-size: 12px; }

#footer a { float: right; border: solid 1px rgba(0, 0, 0, .1); border-radius: 3px; display: inline-block; padding-left: 7px; padding-right: 7px; color: #3D3D3D; text-decoration: none }

#footer a:hover { text-decoration: underline }

#mainContent { padding: 15px 0; background-color: rgb(236, 239, 243); }

.mainPageTitle { font-size: 24px; font-weight: 700; color: #1c1c1c; line-height: 30px; position: relative; margin-bottom: 10px; padding: 10px; background: #fff; border-radius: 4px; border: solid 1px #dbdfea; }

.mainPageTitle span { font-weight: 400; opacity: .8; font-size: 17px; background:#EF7F1A; padding: 4px 8px 4px 8px; -webkit-border-radius: 4px; margin-left: 10px; -moz-border-radius: 4px; border-radius: 4px; color: #fff }

.text-strong { font-weight: 700 !important }

#mailNameResult { font-weight: 700; font-size: 26px; }

#mailNameResult .description { font-size: 11px; display: block; }

.subTitle { font-size: 12px; font-weight: 400; color: #686868; line-height: 14px; }

.listable { border-collapse: collapse; }

.stats { text-align: center; }

.stats .value { font-size: 32px; font-weight: 700 }

.stats .label { font-size: 12px; font-weight: 400; opacity: .6; color: #111 }

.listable tr th, .listable tr td { text-align: left; border-left: solid 1px rgba(255, 255, 255, .2); border-right: solid 1px rgba(255, 255, 255, .2) }

.tarihsec { cursor: pointer !important }

.listable thead tr th { background-color: #6f7982; font-weight: bold; color: #fff; font-size: 16px; padding: 10px 10px; }

.listable.sm thead tr th { padding: 5px 10px; font-size: 13px; }

.listable tbody tr td { border: solid 1px rgba(0, 0, 0, .1); font-size: 12px; padding: 5px 10px; cursor: pointer; }

.listable tbody tr { -webkit-transition: all .2s linear; -moz-transition: all .2s linear; -ms-transition: all .3s linear; -o-transition: all .2s linear; transition: all .2s linear; }

.listable tbody tr:hover > td:not(.selected), .listable tbody tr td.active:not(.tableContainer) { background-color: #F1F1F1; color: #c0392b }

.listable tbody tr td.selected { background: #fcf8e3; color: #c0392b !important }

.listable tbody tr td.text-right, .listable thead tr th.text-right, .listable tfoot tr td.text-right { text-align: right }

.listable tbody tr td.text-center, .listable thead tr th.text-center, .listable tfoot tr td.text-center { text-align: center }

.listable tbody tr:hover { -webkit-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10); -moz-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10); box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10); }

.hover-table tbody tr:hover { -webkit-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.10); -moz-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.10); box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.10); }

.listable tfoot tr td { background-color: #6f7982; color: #fff; font-size: 16px; font-weight: bold; padding: 10px 10px; }

.lgText { font-size: 16px; color: #c0392b; font-weight: bold; }

.text-nowrap { white-space: nowrap !important }

.filterBox { padding: 12px; background-color: #D5D5D5; }

.filterBox h2 { padding-bottom: 6px; color: #6C6C6C; font-size: 14px; }

.exportOptions { text-align: right; border-bottom: solid 1px rgba(0, 0, 0, .1); font-size: 12px; padding-bottom: 5px; margin-bottom: 10px; }

.exportOptions a { display: inline-block; margin-left: 5px; color: #8A8A8A; font-weight: bold; text-decoration: none; }

.exportOptions a:hover { text-decoration: underline }

.text-danger { color: #c0392b }

a.purple { background-color: #9b59b6; color: #fff !important; padding-left: 5px; padding-right: 5px; border-radius: 3px; }

a.blue { background-color: #3498db; color: #fff !important; padding-left: 5px; padding-right: 5px; border-radius: 3px; }

a.green { background-color: #62cb31; color: #fff !important; padding-left: 5px; padding-right: 5px; border-radius: 3px; }

td.tableContainer { padding: 0; border: none !important }

.hidden { display: none !important }

.tabMenu { display: block; float: left; list-style-type: none; margin: 0; padding: 0; }

.tabMenu li { float: left; position: relative; }

.tabMenu li a { display: block; border-left: solid 1px rgba(0, 0, 0, .3); border-top: solid 1px rgba(0, 0, 0, .3); border-right: solid 1px rgba(0, 0, 0, .3); padding: 6px 7px; font-size: 12px; font-weight: 700; color: #1c1c1c; text-decoration: none; margin-right: 1px; border-radius: 3px 3px 0 0; background-color: gainsboro }

.tabMenu li:hover > a, .tabMenu li a.active { background-color: #B5181B; color: #fff; }

.tabContent { padding: 15px; border: solid 1px rgba(0, 0, 0, .1); border-radius: 0 5px 5px 5px; }

.secondTitle { color: #B5181B; font-weight: 700; font-size: 14px; padding-bottom: 10px; }

.label { display: inline; padding: .2em .6em .3em; font-size: 75%; font-weight: bold; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em; }

.label-warning { background-color: #f0ad4e; }

.label-success { background-color: #5cb85c; }

.label-danger { background-color: #d9534f; }

h5 { font-size: 16px; font-weight: 700 !important; margin: 0; padding: 10px; background: rgb(80, 80, 100); color: #fff !important; }

#toplamSelected { position: fixed; z-index: 5665; right: 30px; bottom: 0; padding: 15px; background-color: #fff; -webkit-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10); -moz-box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10); box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10); min-width: 25%; }

.yes-print, .yes-print-inline { display: none }

@media print {
    body, html { background: none !important; }

    body { line-height: 14px; font-size: 12px; background: none !important; }

    .no-print { display: none !important }

    .yes-print { display: block !important }

    .yes-print-inline { display: inline !important }

    #main { padding-left: 0px !important; }
}

@media (min-width: 576px) {
    .text-sm-left { text-align: left !important }

    .text-sm-right { text-align: right !important }

    .text-sm-center { text-align: center !important }
}

@media (min-width: 768px) {
    .text-md-left { text-align: left !important }

    .text-md-right { text-align: right !important }

    .text-md-center { text-align: center !important }
}

@media (min-width: 992px) {
    .text-lg-left { text-align: left !important }

    .text-lg-right { text-align: right !important }

    .text-lg-center { text-align: center !important }
}

@media (min-width: 1200px) {
    .text-xl-left { text-align: left !important }

    .text-xl-right { text-align: right !important }

    .text-xl-center { text-align: center !important }
}

.padTop { padding-top: 10px }

.sepBox { background-color: #D7D7D7; }

.sepTitle { background-color: #6f7982; padding: 5px 10px; font-size: 14px; font-weight: bold; color: #fff; }

.sepContent { font-size: 12px; line-height: 15px; padding-top: 10px; padding: 10px; }

.pvtUi { width: 100%; }

.w1 { width: 1px }


#leftMenu.Toggle { left: 0; opacity: 1; }





#main.ajaxPage { padding-left: 0 }

#topSide { background-color: #fff; height: 60px; }

#datetime { float: left; font-size: 24px; font-family: 'digital-7'; line-height: 20px; color: #2D2D2D; padding-right: 10px; text-align: right; width: 135px; padding: 10px; border-right: solid 1px rgba(0, 0, 0, .1); }

#piyasalar { float: left; width: 250px; background-color: #fff; padding: 10px; position: relative; border-left: solid 1px rgba(0, 0, 0, .1); border-right: solid 1px rgba(0, 0, 0, .1); }

#piyasalar:after { position: absolute; content: ""; right: 0; top: 0; bottom: 0; width: 50px; background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%); background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%); background-image: -ms-linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%); }

#piyasalar:before { position: absolute; content: ""; left: 0; top: 0; bottom: 0; width: 50px; background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%); background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%); background-image: -ms-linear-gradient(0deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%); }

#datetime span { color: #9F9F9F; font-family: 'digital-7'; display: block; font-size: 16px; }

.para { display: block; float: left; padding-right: 10px; margin-right: 10px; border-right: solid 1px rgba(0, 0, 0, .1); color: #9F9F9F; line-height: 18px; padding-left: 30px; background-repeat: no-repeat; background-position: left center; }

.para span { display: block; color: #2D2D2D; font-family: 'digital-7'; font-size: 22px; }

#userNameSurname { padding: 15px; line-height: 30px; float: left; color: #7B7B7B; font-size: 14px; font-family: 'ember', Arial }

#userNameSurname strong { font-family: 'ember', Arial; }

#userMenu { float: left; padding-top: 15px; padding-bottom: 15px; line-height: 30px; padding-right: 15px; }

#userMenu a { font-size: 20px; color: #A0A0A0; text-shadow: 1px 1px #fff; display: inline-block; padding-left: 10px; padding-right: 10px; border-left: solid 1px rgba(0, 0, 0, .05); }

#userMenu a:hover { color: #bd5c2f }

.table-responsive { min-height: .01%; overflow-x: auto; }

@media screen and (max-width: 767px) {
    .table-responsive { width: 100%; margin-bottom: 15px; overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; border: 1px solid #ddd; }

    .table-responsive > .table { margin-bottom: 0; }

    .table-responsive > .table > thead > tr > th, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > tbody > tr > td, .table-responsive > .table > tfoot > tr > td { white-space: nowrap; }

    .table-responsive > .table-bordered { border: 0; }

    .table-responsive > .table-bordered > thead > tr > th:first-child, .table-responsive > .table-bordered > tbody > tr > th:first-child, .table-responsive > .table-bordered > tfoot > tr > th:first-child, .table-responsive > .table-bordered > thead > tr > td:first-child, .table-responsive > .table-bordered > tbody > tr > td:first-child, .table-responsive > .table-bordered > tfoot > tr > td:first-child { border-left: 0; }

    .table-responsive > .table-bordered > thead > tr > th:last-child, .table-responsive > .table-bordered > tbody > tr > th:last-child, .table-responsive > .table-bordered > tfoot > tr > th:last-child, .table-responsive > .table-bordered > thead > tr > td:last-child, .table-responsive > .table-bordered > tbody > tr > td:last-child, .table-responsive > .table-bordered > tfoot > tr > td:last-child { border-right: 0; }

    .table-responsive > .table-bordered > tbody > tr:last-child > th, .table-responsive > .table-bordered > tfoot > tr:last-child > th, .table-responsive > .table-bordered > tbody > tr:last-child > td, .table-responsive > .table-bordered > tfoot > tr:last-child > td { border-bottom: 0; }
}

.whiteBox { padding: 15px; background: #fff; }

.reportTable { border-collapse: collapse }

.curPointer { cursor: pointer !important }

hr { border-top: solid 1px #ddd; margin-bottom: 15px; margin-top: 15px; height: 1px; border-bottom: none; border-right: none; border-left: none; }

.reportTable tr td, .reportTable tr th { font-family: Courier New; font-size: 12px; border-bottom: dashed 1px #B7B7B7; line-height: 14px; padding-bottom: 4px; padding-top: 4px; }

.reportTable tfoot tr td { border: none !important; padding-top: 15px !important; }

.reportTable tr td.text-right { text-align: right }

.reportTable tr:hover > td { background: #fcf8e3; }

.borderBox { padding: 15px; border: solid 1px #ebebeb; border-radius: 3px; }

#rightSide { position: fixed; right: -400px; top: 0; bottom: 0; width: 300px; background-color: #fff; padding: 20px; z-index: 9786; box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, .5); -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -ms-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out; }

#rightSide.visible { right: 0 !important }

#rightInside { position: relative; height: 100%; overflow-y: auto; }

.rightClose { position: absolute; left: -40px; bottom: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background-color: #c0392b; border-radius: 3px 0 0 3px; text-align: center; color: #fff; font-size: 30px; display: block; width: 40px; height: 40px; line-height: 40px; }

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

.tabloList > li { font-weight: bold; font-size: 16px; padding-bottom: 10px; padding-top: 10px; border-top: solid 1px #ebebeb; cursor: pointer }

.tabloList > li:hover { background-color: #EBEBEB; }

.tabloList > li > ul { padding: 10px; list-style-type: none; margin: 0; font-weight: normal; }

.tabloList > li > ul > li { font-size: 12px; line-height: 18px; }

.tabloList > li > ul > li:hover { padding-left: 5px; background-color: #fcf8e3; }

.coChanger { float: left; padding-left: 10px; padding-top: 0px; max-width: 350px; }

#coChanger select, #coChanger select option { color: #3C3C3C }

.uk-pointer { cursor: pointer }

.formtable { margin-left: -5px; margin-right: -5px; width: 100%; }

.formtable tr td { padding: 5px; font-size: 12px; color: #363636; }

.dsItem { border: solid 1px rgba(0, 0, 0, .15); font-size: 11px; padding: 5px; line-height: 14px; border-radius: 2px; margin-bottom: 3px; background-color: rgba(255, 255, 255, .2) }

.borderTable { border-collapse: collapse; border: solid 1px #666; }

.borderTable tr td { padding: 10px; font-size: 11px; }

.borderTable tr td.left { border-left: solid 1px #666; }

.borderTable tr td.right { border-right: solid 1px #666; }

.borderTable tr td.bottom { border-bottom: solid 1px #666; }

.borderTable tr td.top { border-top: solid 1px #666; }

h2.offerCompanyName { font-size: 14px; color: #686868; margin-bottom: 5px }

h2.offerTitle { font-size: 34px; margin: 0; font-weight: bold; }

.deletAbleRow { position: relative }

.deletAbleRow .btnDelete { position: absolute; display: none; right: 100%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%) }

.deletAbleRow:hover > .btnDelete { display: block }

.mBottom { margin-bottom: 10px }

.wBox { padding: 10px; color: #fff; margin-bottom: 10px; border-radius: 1px; }

.wBoxTitle { font-weight: bold; font-size: 16px }

.wBoxContent { padding-top: 15px }

.pBox { margin-bottom: 3px; background-color: rgba(255, 255, 255, .15); padding: 0; font-size: 11px; cursor: move; -webkit-transition: transform .2s linear; -moz-transition: transform .2s linear; -ms-transition: transform .2s linear; -o-transition: transform .2s linear; transition: transform .2s linear; }

.pBoxContent { padding: 10px; line-height: 15px; }

.pBoxTopLink { display: block; padding: 5px 10px; background-color: rgba(0, 0, 0, .20); font-size: 12px; font-weight: normal; }

.pBox.ui-sortable-helper { -ms-transform: rotate(4deg); -webkit-transform: rotate(4deg); transform: rotate(4deg); -webkit-transition: transform .2s linear; -moz-transition: transform .2s linear; -ms-transition: transform .2s linear; -o-transition: transform .2s linear; transition: transform .2s linear; }

.pBox a { color: #fff }

.pBox a:hover { color: #fff }

.pBox:hover { background-color: rgba(255, 255, 255, .25) }

.pBoxTable { width: 100%; border-collapse: collapse }

.pBoxTable tr td { border-top: solid 1px rgba(255, 255, 255, .25) }

.bigPrice { font-size: 14px; font-weight: bold }

#offerDetails { padding: 15px; background-color: #F9F9F9 }

.offerTable tr td { border-top: solid 1px #E1E1E1 }

.offerTable tr th { border-bottom: solid 2px #9E9E9E; }

.offerTable tr td, .offerTable tr th { padding: 10px }

.offerTable tr td.text-right, .offerTable tr th.text-right { text-align: right }

.pver { padding: 5px }

.calendarYear { background-color: #c0392b; color: #fff; font-weight: bold; line-height: 24px; padding: 5px; box-sizing: border-box; font-size: 14px; margin-bottom: 2px; }

.calendarMonth { background-color: #3B3B3B; color: #fff; font-weight: bold; line-height: 20px; padding: 5px; box-sizing: border-box; font-size: 11px; margin-bottom: 2px; }

.calendarDay { border-bottom: solid 1px #EBEBEB; position: relative; min-height: 20px; cursor: pointer; }

.calendarDay:hover { background-color: #F8F8F8 }

.calendarNumber { position: absolute; left: 0; top: 50%; font-size: 10px; text-align: right; width: 25px; line-height: 20px; font-weight: 700; color: #929292; display: inline-block; -webkit-transform: translateY(-50%); transform: translateY(-50%) }

.calendarDayName { position: absolute; right: 5px; top: 50%; font-size: 10px; line-height: 20px; font-weight: 300; color: #B7B7B7; display: inline-block; -webkit-transform: translateY(-50%); transform: translateY(-50%) }

.calendarDayContent { position: absolute; left: 32px; top: 0; bottom: 0; line-height: 14px; }

.calendarIcon { margin-top: 5px; height: 8px; width: 8px; border-radius: 50%; background-color: #2B80C6; display: inline-block; margin-right: 5px; position: absolute; left: -30px; }

.calendarIconSq { margin-top: 0px; height: 14px; padding-left: 5px; padding-right: 5px; line-height: 14px; border-radius: 2px; display: inline-block; margin-right: 4px; color: #fff; font-size: 9px; font-weight: 300; }

.uretimBox { margin-bottom: 2px; line-height: 15px; color: #fff; position: relative; height: 120px; }

.uretimHatSpeed { position: absolute; display: inline-block; right: 10px; bottom: 15px; font-weight: 300; color: rgba(255, 255, 255, .3); font-size: 36px; line-height: 20px; letter-spacing: -3px; }

.uretimHatBaslik { position: absolute; left: 10px; top: 13px; font-weight: bold; color: rgba(255, 255, 255, .8); font-size: 50px; line-height: 30px; display: inline-block; }

.uretimHatGunluk { position: absolute; display: inline-block; right: 10px; top: 15px; font-weight: 300; color: rgba(255, 255, 255, .3); font-size: 36px; line-height: 20px; letter-spacing: -3px }

.uretimHatGunluk small, .uretimHatSpeed small { font-size: 12px; letter-spacing: 0 }

.uretimHatSpeed i, .uretimHatGunluk i { color: #fff; margin-left: 5px; display: inline-block; width: 40px; text-align: center }

.uretimAciklamasi { color: #fff; position: absolute; left: 10px; width: 50%; top: 60px; font-size: 11px; }

.gunler6 { background-color: #F8F8F8 }

.gunler7 { background-color: #EEE }

.calendarOwl .item .itemContent { padding: 1px; box-sizing: border-box; }

.addHereBtn { position: absolute; right: 10px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); display: none; z-index: 65; color: red; }

.calendarDay:hover > .addHereBtn { display: inline-block }

.projectContainer { padding: 5px }

.projectBox { padding: 10px; border: solid 2px #DDD; display: block; border-radius: 5px; color: #3D3D3D; line-height: 20px; text-decoration: none }

.partNumber { font-size: 18px; font-weight: bold; display: block; }

.baslangicBitis { font-size: 11px; display: inline-block; color: #8F8F8F; border-top: solid 1px #E8E8E8 }

.baslanmaDurumu { font-size: 20px; display: block; }

.roundedBox { border-radius: 6px; border: solid 1px #DCDCDC; position: relative; min-height: 150px; }

.roundedBoxContent { width: 90%; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: block; position: absolute; }

.stickerContent, .stickerContent * { font-family: Arial, Helvetica, sans-serif !important; background-color: #fff; }

.stickerTitle { display: block; font-size: .5cm; font-weight: bold; line-height: .53cm }

.stickerRow { font-size: .3cm; display: block; padding-top: .1cm; line-height: .32cm }

.borderedLabel { display: block; cursor: pointer; border: 1px solid #DDD; margin-bottom: 5px; border-radius: 6px; padding-left: 40px; position: relative; font-weight: normal; line-height: 17px; padding-bottom: 12px; padding-top: 12px; }

.borderedLabel input { position: absolute; left: 15px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%) }

.homeTable { font-size: 11px; }

.homeTable tr th { border-bottom: solid 2px #E2E2E2 }

.homeTable tr td { border-bottom: solid 1px #EBEBEB; padding-bottom: 5px; padding-top: 5px; line-height: 15px }

.homeTable tr:hover > td { background-color: #fff }

.homeTable tr:last-child td { border-bottom: none }

.homeBox { background-color: #F8F8F8; padding: 12px; border-radius: 6px; margin-bottom: 15px }

.homeBox.warning { background-color: #FEF3DE; }

.homeBoxTitle { font-size: 19px; font-weight: 700; color: #7B7B7B; line-height: 20px; padding-top: 6px; margin-bottom: 13px; }

.homeBoxContent { font-size: 12px; line-height: 17px }

.topBorderDiv { border-top: solid 1px #D6D6D6; padding-top: 15px; margin-top: 15px; }

.routeBox { border-style: solid; border-width: 3px; border-color: rgb(216, 216, 216); border-radius: 2px; background-color: rgb(254, 254, 253); padding: 15px; position: relative; font-size: 12px; margin-bottom: 20px; }

#uretimRotalariDiv { padding-top: 20px }

.routeBoxTitle { position: absolute; display: inline-block; border: solid 3px #2b303b; border-radius: 18px; line-height: 30px; color: #fff; top: -18px; background-color: #2b303b; left: 10px; }

.routeBoxDelete { position: absolute; right: 10px; display: inline-block; border-radius: 13px; line-height: 26px; width: 26px; color: #fff; top: -13px; background-color: #f0ad4e; text-align: center; }

.routeBoxDelete:hover { color: #fff; background-color: #AB0C10 }

.routeBoxName { display: inline-block; padding-left: 10px; padding-right: 10px; border-radius: 15px; color: red; background-color: #fff; font-weight: bold; }

.routeBoxDesc { display: inline-block; padding-left: 10px; padding-right: 15px; font-weight: bold; }

.routeBoxContent { padding-top: 15px; }

.routeBoxItem { float: left; margin-right: 10px; line-height: 16px; font-size: 11px; padding: 10px 20px 10px 45px; border-radius: 27px; border: solid 1px #D8D8D8; position: relative; }

.routeBoxItem.noEdit { padding-left: 20px !important }

.routeBoxItem.red { color: #fff !important; background-color: #d9534f !important; border-color: rgba(255, 255, 255, 0) !important; padding-left: 20px !important }

.routeBoxItem.yellow { color: #fff !important; background-color: #f0ad4e !important; border-color: rgba(255, 255, 255, 0) !important; padding-left: 20px !important }

.routeBoxItem.blue { color: #fff !important; background-color: #709DCF !important; border-color: rgba(255, 255, 255, 0) !important; padding-left: 20px !important }

.routeBoxItem a { display: inline-block; position: absolute; top: 50%; font-size: 17px; color: #909090; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 10px; }

.routeBoxArrow { float: left; line-height: 54px; font-size: 16px; color: #A1A1A1; margin-right: 10px }

.selectThisRoute { float: right; display: block; line-height: 54px; border-radius: 27px; font-size: 15px; font-weight: bold; color: #fff; background-color: #5cb85c; padding-left: 25px; padding-right: 25px; border: none; }

.selectThisRoute:hover { color: #fff }

.dateRanges { display: block; float: right; padding-right: 20px; font-size: 13px; font-weight: bold; }

.owlBox .item { width: 50%; float: left; }

@media print {
    .owlBox .item { width: 100%; float: none; position: relative !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important }

    .owlBox { height: auto !important; }
}

.planBox { padding: 10px; border: solid 2px #d8d8d8; border-radius: 3px; margin: 5px; background-color: #fff; font-size: 11px; line-height: 17px; }

.planBox:hover { background-color: #FFFDDF }

.planDates { line-height: 30px; background-color: #d8d8d8; padding-left: 10px; padding-right: 10px; float: left; margin-right: 10px; border-radius: 3px }

.rotaDots { display: inline-block; height: 20px; width: 20px; border-radius: 50%; background-color: #E6E6E6; color: #333; text-align: center; line-height: 20px; margin-left: 4px; margin-top: 5px; }

.rotaDotDesc { display: inline-block; line-height: 30px; font-size: 11px; }

.planQty { float: left; line-height: 30px; font-size: 11px; color: #e31e24; }

.planQty strong { font-size: 26px; font-family: 'digital-7' }

.smTable { border-collapse: collapse; }

.smTable tr td { border-bottom: solid 1px #E3E3E3; border-top: solid 1px #E3E3E3; padding: 3px 5px; }

.smTable tr th { border-bottom: solid 2px #CACACA; padding: 6px 5px; }

.lBaslik { font-size: 18px; font-weight: 700 }

.rBls { background: #DF2025; color: #fff; text-align: right; }

.propBoxContainer { margin-left: -10px; margin-right: -10px; }

.propBox { float: left; width: 25%; box-sizing: border-box; padding-right: 10px; padding-left: 10px; }

.propBoxContent { border: solid 1px #E2E2E2; border-radius: 3px; line-height: 25px; margin-bottom: 4px; }

.propName { font-size: 11px; background-color: #686868; color: #fff; border-radius: 3px; line-height: 25px; display: block; float: left; width: 34%; text-align: right; padding-right: 10px; }

.propDesc { text-align: left; width: 65%; float: right; display: block; line-height: 25px; font-weight: bold; font-size: 14px; }

.text-sm { font-size: 11px; line-height: 15px }

.table tr td.bg-gray, .table tr th.bg-gray { background-color: #F3F3F3 !important }

@media print {
    .homeBox { background: none; border: solid 1px #000 }

    .topBorderDiv { border-top: solid 1px #000 }

    .propBoxContainer { margin-left: -4px; margin-right: -4px; }

    .propBox { padding-right: 2px; padding-left: 2px; }

    .propBoxContent { line-height: 15px; margin-bottom: 2px; }

    .propName { font-size: 9px; background-color: #fff; color: #000; border-radius: 3px; line-height: 15px; width: 100%; float: none; text-align: center }

    .propDesc { line-height: 15px; font-size: 9px; width: 100%; float: none; text-align: center; }

    .homeTable tr td { padding-bottom: 2px; padding-top: 2px; }

    .no-print, .no-print * { display: none !important }
}

.svgLoader { background-image: url(images/form-progress.svg); background-repeat: no-repeat; background-position: top; text-align: center; padding-top: 150px; padding-bottom: 15px; }

.homeBoxBtns { height: 80px; text-align: center; line-height: 25px; color: #fff; background-color: #2B63A8; display: block; border-radius: 4px; }

.homeBoxBtns i { font-size: 36px; }

.homeBoxBtns a { display: block; font-size: 14px; font-weight: bold; color: #CCCCCC }

.homeBoxBtns a span { display: block; color: #FEFEFE }

.homeBoxBtns a:hover { text-decoration: none; color: #CCCCCC }

.homeBoxesTitle { font-size: 20px; font-weight: bold; border-bottom: solid 1px #E7E7E7; margin-bottom: 10px; color: #c0392b }

.statusBox { padding: 10px; border-radius: 5px; background-color: #fff; border: solid 1px #DEDEDE; font-size: 11px; line-height: 17px; }

.statusName { font-size: 14px; font-weight: bold; line-height: 20px; }

.statusDate { font-style: italic; font-size: 12px; }

.statusUserName { font-size: 14px; font-weight: 300; opacity: .6 }

.statusBox.active { background-color: #7B7B7B; color: #fff; }

.statusNotes { margin-top: 6px; padding-top: 6px; border-top: solid 1px rgba(0, 0, 0, .2) }

.iconbox { display: inline-block; width: 30px; height: 30px; border: solid 1px #E8E8E8; margin: 3px; border-radius: 3px; position: relative }

.iconbox i { display: inline-block; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #4C4C4C; font-size: 20px; }

.introContent { padding-top: 50px; }

.introIcon { font-size: 100px; color: #B4B4B4; text-align: center; line-height: 100px; }

.introTitle { color: #242424; font-size: 60px; text-align: center; line-height: 60px; }

.introDescription { color: #7A7A7A; font-size: 15px; font-weight: 300; line-height: 20px; text-align: center; }

.whatsCanIdo { padding-top: 50px; color: #4E4E4E; text-align: center; padding-bottom: 50px; }

.whatsCanIdo p strong { font-size: 16px; }

.whatsItem { font-weight: 300; font-size: 14px; line-height: 26px; }

.highlight { border: 1px solid #707d86; font-weight: bold; min-width: 50px; min-height: 16px; display: inline-block;; }

.lblSelectFiles { background-color: white; outline: 2px dashed #dedede; display: block; text-align: center; color: #787878; padding: 15px; border-radius: 3px; cursor: pointer; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }

.lblSelectFiles { font-size: 24px; color: #4F4F4F }

.lblSelectFiles:hover { background-color: #DDD }

.lblSelectFiles span { display: block; padding-top: 10px; font-weight: normal; font-size: 14px; }

#preLoader { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, .7); z-index: 99997; display: none; overflow: hidden }

@-webkit-keyframes spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

@-moz-keyframes spin {
    0% {
        -moz-transform: rotate(0)
    }
    100% {
        -moz-transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

.spinner { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99998; background: rgba(0, 0, 0, .7); overflow: hidden; }

.spinner div:first-child { display: block; position: relative; left: 50%; top: 50%; width: 150px; height: 150px; margin: -75px 0 0 -75px; border-radius: 50%; box-shadow: 0 3px 3px 0 #ff3d71; transform: translate3d(0, 0, 0); animation: spin 2s linear infinite }

.spinner div:first-child:after, .spinner div:first-child:before { content: ''; position: absolute; border-radius: 50% }

.spinner div:first-child:before { top: 5px; left: 5px; right: 5px; bottom: 5px; box-shadow: 0 3px 3px 0 #ffaa00; -webkit-animation: spin 3s linear infinite; animation: spin 3s linear infinite }

.spinner div:first-child:after { top: 15px; left: 15px; right: 15px; bottom: 15px; box-shadow: 0 3px 3px 0 #0095ff; animation: spin 1.5s linear infinite }

#preLoaderContent { position: fixed; left: 50%; top: 50%; z-index: 99999; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) }

.cssload-thecube { width: 73px; height: 73px; margin: 0 auto; margin-top: 49px; position: relative; transform: rotateZ(45deg); -o-transform: rotateZ(45deg); -ms-transform: rotateZ(45deg); -webkit-transform: rotateZ(45deg); -moz-transform: rotateZ(45deg); }

.cssload-thecube .cssload-cube { position: relative; transform: rotateZ(45deg); -o-transform: rotateZ(45deg); -ms-transform: rotateZ(45deg); -webkit-transform: rotateZ(45deg); -moz-transform: rotateZ(45deg); }

.cssload-thecube .cssload-cube { float: left; width: 50%; height: 50%; position: relative; transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); }

.cssload-thecube .cssload-cube:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgb(43, 160, 199); animation: cssload-fold-thecube 2.76s infinite linear both; -o-animation: cssload-fold-thecube 2.76s infinite linear both; -ms-animation: cssload-fold-thecube 2.76s infinite linear both; -webkit-animation: cssload-fold-thecube 2.76s infinite linear both; -moz-animation: cssload-fold-thecube 2.76s infinite linear both; transform-origin: 100% 100%; -o-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; -webkit-transform-origin: 100% 100%; -moz-transform-origin: 100% 100%; }

.cssload-thecube .cssload-c2 { transform: scale(1.1) rotateZ(90deg); -o-transform: scale(1.1) rotateZ(90deg); -ms-transform: scale(1.1) rotateZ(90deg); -webkit-transform: scale(1.1) rotateZ(90deg); -moz-transform: scale(1.1) rotateZ(90deg); }

.cssload-thecube .cssload-c3 { transform: scale(1.1) rotateZ(180deg); -o-transform: scale(1.1) rotateZ(180deg); -ms-transform: scale(1.1) rotateZ(180deg); -webkit-transform: scale(1.1) rotateZ(180deg); -moz-transform: scale(1.1) rotateZ(180deg); }

.cssload-thecube .cssload-c4 { transform: scale(1.1) rotateZ(270deg); -o-transform: scale(1.1) rotateZ(270deg); -ms-transform: scale(1.1) rotateZ(270deg); -webkit-transform: scale(1.1) rotateZ(270deg); -moz-transform: scale(1.1) rotateZ(270deg); }

.cssload-thecube .cssload-c2:before { animation-delay: 0.35s; -o-animation-delay: 0.35s; -ms-animation-delay: 0.35s; -webkit-animation-delay: 0.35s; -moz-animation-delay: 0.35s; }

.cssload-thecube .cssload-c3:before { animation-delay: 0.69s; -o-animation-delay: 0.69s; -ms-animation-delay: 0.69s; -webkit-animation-delay: 0.69s; -moz-animation-delay: 0.69s; }

.cssload-thecube .cssload-c4:before { animation-delay: 1.04s; -o-animation-delay: 1.04s; -ms-animation-delay: 1.04s; -webkit-animation-delay: 1.04s; -moz-animation-delay: 1.04s; }

@keyframes cssload-fold-thecube {
    0%, 10% {
        transform: perspective(136px) rotateX(-180deg);
        opacity: 0;
    }
    25%, 75% {
        transform: perspective(136px) rotateX(0deg);
        opacity: 1;
    }
    90%, 100% {
        transform: perspective(136px) rotateY(180deg);
        opacity: 0;
    }
}

@-o-keyframes cssload-fold-thecube {
    0%, 10% {
        -o-transform: perspective(136px) rotateX(-180deg);
        opacity: 0;
    }
    25%, 75% {
        -o-transform: perspective(136px) rotateX(0deg);
        opacity: 1;
    }
    90%, 100% {
        -o-transform: perspective(136px) rotateY(180deg);
        opacity: 0;
    }
}

@-ms-keyframes cssload-fold-thecube {
    0%, 10% {
        -ms-transform: perspective(136px) rotateX(-180deg);
        opacity: 0;
    }
    25%, 75% {
        -ms-transform: perspective(136px) rotateX(0deg);
        opacity: 1;
    }
    90%, 100% {
        -ms-transform: perspective(136px) rotateY(180deg);
        opacity: 0;
    }
}

@-webkit-keyframes cssload-fold-thecube {
    0%, 10% {
        -webkit-transform: perspective(136px) rotateX(-180deg);
        opacity: 0;
    }
    25%, 75% {
        -webkit-transform: perspective(136px) rotateX(0deg);
        opacity: 1;
    }
    90%, 100% {
        -webkit-transform: perspective(136px) rotateY(180deg);
        opacity: 0;
    }
}

@-moz-keyframes cssload-fold-thecube {
    0%, 10% {
        -moz-transform: perspective(136px) rotateX(-180deg);
        opacity: 0;
    }
    25%, 75% {
        -moz-transform: perspective(136px) rotateX(0deg);
        opacity: 1;
    }
    90%, 100% {
        -moz-transform: perspective(136px) rotateY(180deg);
        opacity: 0;
    }
}

body.modal-open .datepicker { z-index: 1200 !important; }

fieldset {
 border: solid 1px #dbdfea !important;  background-color: #ffffff; margin: 0; min-width: 0; padding: 10px !important; position: relative; border-radius: 4px; display: block !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;width:auto !important;
}
.formCard {
 border: solid 1px #dbdfea;
 background-color: #fff;
 padding: 10px;
 border-radius: 4px;
}
.formCardTitle {
 font-weight: 700;
 color: rgb(48, 53, 64);
 font-size:18px;
 margin-bottom: 12px;
 position: relative;

}
.formCardTitle::after {
 position: absolute;
 left: 0;
 top:100%;
 width: 20px;
 height: 2px;
 background: #dbdfea;
 border-radius: 1px;
 content: "";
 display: inline-block;
}

fieldset fieldset { background: transparent; }

legend { background: none !important; display: block; font-size: 16px; font-weight: bold; color: rgb(48, 53, 64); width: auto;margin-bottom: 25px; border-right: none; box-sizing: border-box; position: relative; top: 30px }
legend::after, legend::before {
 display: none;
}

legend[role=button]::after { background: url(../img/expanded.png); background-position: right center; background-repeat: no-repeat; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); height: 17px; width: 30px; display: inline-block; clear: both; }

legend[aria-expanded=false]::after { background: url(../img/collapsed.png); background-position: right center; background-repeat: no-repeat; content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); height: 17px; width: 30px; display: inline-block; }

.container-confirm { }

.productThumb { width: 60px; height: 60px; padding: 2px; border: solid 1px #E4E4E4; border-radius: 3px; }

.messageBox { padding: 20px 20px 20px 20px; background-color: #FFF; box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.08), 0 1px 3px 0 rgba(0, 0, 0, 0.12); border-radius: 2px; margin-top: 0px; margin-bottom: 10px; text-transform: uppercase !important; font-size: 13px; }

.messageHeader { padding: 20px 20px 20px 20px; background-color: #FFF; box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.08), 0 1px 3px 0 rgba(0, 0, 0, 0.12); border-radius: 2px; margin-top: 0px; margin-bottom: 10px; text-transform: uppercase !important; font-size: 13px; }

.messageHeaderItem { float: left; width: 25%; }

.messageBox.new { background-color: rgba(255, 193, 7, .1) }

.dateAndDepartment { width: 200px; float: left; padding-right: 10px; margin-right: 20px; border-right: solid 1px rgba(0, 0, 0, 0.1); text-align: center; }

.messageDate { font-size: 18px; display: block; text-align: center; margin-bottom: 4px; }

.messageDepartment { display: inline-block; padding: 5px 8px; border-radius: 3px; color: #000; font-size: 14px; background-color: #ffc107; }

.lastMessageBy { padding-bottom: 10px; margin-bottom: 10px; border-bottom: solid 1px rgba(0, 0, 0, .1) }

.smallDate { padding-top: 6px; margin-top: 6px; border-top: solid 1px rgba(0, 0, 0, .05); font-size: 12px; color: rgba(0, 0, 0, .3) }

@media print {
    .messageBox { font-size: 11px !important; padding: 5px; box-shadow: none; border: solid 1px #000 }
}

#skuWizardContent { }

.maxH500 { max-height: 500px; overflow: auto }

#sideMenuContainer { position: relative; }

.nav-side-menu { overflow: auto; font-size: 12px; font-weight: 400; color: #e1ffff; }

.nav-side-menu .brand { background-color: #23282e; line-height: 50px; display: block; text-align: center; font-size: 14px; }

.nav-side-menu .toggle-btn { display: none; }

.nav-side-menu ul, .nav-side-menu li { list-style: none; padding: 0px; margin: 0px; line-height: 35px; cursor: pointer; }

.nav-side-menu ul :not(collapsed) .arrow:before, .nav-side-menu li :not(collapsed) .arrow:before { font-family: "Font Awesome 5 Pro"; content: "\f107"; display: inline-block; padding-left: 10px; padding-right: 10px; vertical-align: middle; float: right; font-weight: 300; }

.nav-side-menu ul .active, .nav-side-menu li .active { border-left: 3px solid #d19b3d; background-color: #4f5b69; }

.nav-side-menu ul .sub-menu li.active, .nav-side-menu li .sub-menu li.active { color: #d19b3d; }

.nav-side-menu ul .sub-menu li.active a, .nav-side-menu li .sub-menu li.active a { color: #d19b3d; }

.nav-side-menu ul .sub-menu li, .nav-side-menu li .sub-menu li { background-color: #181c20; border: none; line-height: 38px; border-bottom: 1px solid #23282e; margin-left: 0px; position: relative; }

.nav-side-menu ul .sub-menu li:hover, .nav-side-menu li .sub-menu li:hover { background-color: #020203; }

.nav-side-menu li { padding-left: 0px; border-left: 3px solid #2e353d; border-bottom: 1px solid #23282e; }

.nav-side-menu li a { text-decoration: none; color: #F0F0F0; display: block; line-height: 42px; font-weight: 700; font-size: 13px; }

.nav-side-menu .sub-menu li a { text-decoration: none; color: #CACACA; display: block; line-height: 38px; padding-left: 10px; font-size: 12px !important; font-weight: normal; }

.nav-side-menu li a i { padding-left: 10px; width: 20px; padding-right: 20px; opacity: .5; }

.nav-side-menu li:hover { border-left: 3px solid #d19b3d; background-color: #4f5b69; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease; transition: all 0.5s ease; }

.nav-side-menu .menu-list .menu-content { display: block; }

.ui-datepicker { z-index: 1522 !important }

.hidden-xs-up { display: none !important; }

@media (max-width: 575.98px) {
    .hidden-xs-down { display: none !important; }
}

@media (min-width: 576px) {
    .hidden-sm-up { display: none !important; }
}

@media (max-width: 767.98px) {
    .hidden-sm-down { display: none !important; }
}

@media (min-width: 768px) {
    .hidden-md-up { display: none !important; }
}

@media (max-width: 991.98px) {
    .hidden-md-down { display: none !important; }
}

@media (min-width: 992px) {
    .hidden-lg-up { display: none !important; }
}

@media (max-width: 1199.98px) {
    .hidden-lg-down { display: none !important; }
}

@media (min-width: 1200px) {
    .hidden-xl-up { display: none !important; }
}

.hidden-xl-down { display: none !important; }

.portlet { margin: 0 1em 1em 0; padding: 0.3em; }

.portlet-header { padding: 0.2em 0.3em; margin-bottom: 0.5em; position: relative; }

.portlet-toggle { position: absolute; top: 50%; right: 0; margin-top: -8px; }

.portlet-content { padding: 0.4em; }

.bg-hover:hover { background-color: #fcf8e3 }

.portlet-placeholder { border: 1px dotted black; margin: 0 1em 1em 0; height: 50px; }

.sBoxTable { height: 150px; overflow: auto; }

.whitePage { padding: 20px; background: #ffffff; }

.mixedTable { width: 100%; border-collapse: collapse; border: none; }

.mixedDiv { padding: 5px; background: #e8e7e7; }

.mixedTable thead tr th { background: #e8e7e7; text-align: left }

.mixedTable thead tr th.text-right, .mixedTable tbody tr td.text-right { text-align: right }

.mixedTable tr td { vertical-align: top; }

.miniInput { border: solid 1px #cccccc; height: 28px; line-height: 26px; display: block; width: 100%; margin: 0; font-weight: 400; font-size: 11px; }

.ooBox { padding-right: 20px; margin-right: 10px; border-right: solid 1px #ccc; height: 180px; }

.row > div[class^="col-"]:last-child .ooBox { border-right: none }

.ooTitle { font-size: 14px; font-weight: 700; margin-bottom: 6px; }

.miniTable { width: 100%; border-collapse: collapse; border: none; }

.miniTable tr td { padding: 2px; font-size: 11px; }

.tinyInput { border: solid 1px #ccc; background: #eaeaea; padding: 2px 6px; height: 25px; line-height: 23px; display: block; width: 100%; margin: 0; font-weight: 400; font-size: 10px; border-radius: 2px; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.transparentInput { border: none; background: transparent; display: block; width: 100%; margin: 0; font-weight: 400; font-size: 10px; border-radius: 2px; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; padding: .6rem }

select.tinyInput {
 vertical-align: middle;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");background-repeat: no-repeat;background-position: right .75rem center;background-size: 16px 12px;-webkit-appearance: none;-moz-appearance: none;appearance: none
}

.tinyInput:focus { border-color: #ef7f1a; background-color: #f5f5f5 }
.transparentInput:focus { background-color: #f5f5f5 }

.mixedTable tr th, .mixedTable tr td { border: solid 1px #bbbbbb; white-space: nowrap !important; padding: 3px 6px }

.priceBox { background-color: #E8E7E7; font-size: 14px; line-height: 20px; font-weight: 400; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; padding: 4px; margin-bottom: 3px; }

.priceBox span { display: block; font-size: 12px; float: left; }

.trumbowyg-dropdown-table table { display: table !important; width: 100%; border-collapse: collapse }

.trumbowyg-dropdown-table table tr td { border: 1px dotted #CCC !important; height: 15px !important; cursor: pointer; }

.lds-ring { display: inline-block; position: relative; width: 64px; height: 64px; }

.lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 51px; height: 51px; margin: 6px; border: 6px solid #fff; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #fff transparent transparent transparent; }

.lds-ring div:nth-child(1) { animation-delay: -0.45s; }

.lds-ring div:nth-child(2) { animation-delay: -0.3s; }

.lds-ring div:nth-child(3) { animation-delay: -0.15s; }

@keyframes lds-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.trumbowyg-dropdown-table table tr td:hover { background-color: #F3F3F3 }

.timeline { width: 100%; background: #fff; position: relative; }

.timeline:before { content: ''; position: absolute; top: 0px; left: calc(33% - 3px); bottom: 0px; width: 4px; background: #ddd; }

.timeline:after { content: ""; display: table; clear: both; }

.entry { clear: both; text-align: left; position: relative; }

.entry .title { margin-bottom: .5em; float: left; width: 33%; padding-right: 30px; text-align: right; position: relative; }

.entry .title:before { content: ''; position: absolute; width: 16px; height: 16px; border: 4px solid #00abe8; background-color: #fff; border-radius: 100%; top: 15%; right: -8px; z-index: 99; }

.entry .title h3 { margin: 0; font-size: 120%; }

.entry .title p { margin: 0; font-size: 100%; }

.entry .body { margin: 0 0 3em; float: right; width: 66%; padding-left: 30px; }

.entry .body p { line-height: 1.4em; }

.entry .body p:first-child { margin-top: 0; font-weight: 400; }

.entry .body ul { color: #aaa; padding-left: 0; list-style-type: none; }

.entry .body ul li:before { content: "–"; margin-right: .5em; }

.offerItemOptional { opacity: .7 }

.offerItemOptional span { font-weight: 700; }

.printPageTemplate { box-shadow: 0 .5mm 2mm rgba(0, 0, 0, .1); margin-left: auto; margin-right: auto; background: #fff; position: relative; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }

.printPageTemplateEditable { border: dashed 2px #ebebeb; opacity: .5; padding: 2px; -webkit-border-radius: 3px; cursor: pointer; -moz-border-radius: 3px; border-radius: 3px; font-size: 9px; }

.printPageTemplateEditable:hover { border-color: #ebebeb; opacity: 1; }

.ace_editor, .ace_editor * { font-family: "Monaco", "Menlo", "Ubuntu Mono", "Droid Sans Mono", "Consolas", monospace !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: 0 !important; }

.photoItem { float: left; width: 20%; padding: 5px; }

.photoItemContainer { padding: 2px; border: solid 1px #dadada; border-radius: 2px; margin: 3px; position: relative }

.photoItemContainer img { width: 100%; height: auto; cursor: move; }

.btnDiv { position: absolute; left: 0; right: 0; bottom: 10px; text-align: center; z-index: 2; }

@media screen and (max-width: 1023px) {
    #resultTable, .resultTable {
        border: 0;
    }


    #resultTable thead, .resultTable thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    #resultTable tr, .resultTable tr {
        border-bottom: 3px solid #ddd;
        display: block;
        margin-bottom: .625em;
    }

    #resultTable td, .resultTable td {
        border-bottom: 1px solid #ddd;
        display: block;
        font-size: .8em;
        text-align: right;
    }

    #resultTable td::before, .resultTable td::before {
        content: attr(data-label);
        float: left;
        font-weight: bold;

    }

    #resultTable td:first-child, .resultTable td:first-child {
        background-color: #fdc000;
    }

    #resultTable td:last-child, .resultTable td:last-child {
        border-bottom: 0;
    }
}

#menuSearchBox { display: block; width: 100%; font-size: 12px; font-weight: 300; background: rgba(0, 0, 0, 0.1); color: #777; padding: 10px 30px; border: none}

.tinyLabel {display: inline-block !important; width: auto !important; cursor: pointer; color: rgb(80, 80, 100)}

.handle {
    cursor: grab;}

.sumTitle { display: block; }

.sumCount { display: block; font-size: 16px; font-weight: 300; color: #5e5e5e}

.sumCount strong { font-weight: 700; color: rgb(34, 43, 84);
    font-size: 20px;}

/*
 * The MIT License
 * Copyright (c) 2012 Matias Meno <m@tias.me>
 */
@-webkit-keyframes passing-through {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30%, 70% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px); }
}

@-moz-keyframes passing-through {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30%, 70% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px); }
}

@keyframes passing-through {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30%, 70% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
    100% {
        opacity: 0;
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        transform: translateY(-40px); }
}

@-webkit-keyframes slide-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
}

@-moz-keyframes slide-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
}

@keyframes slide-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px); }
    30% {
        opacity: 1;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px); }
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
    10% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1); }
    20% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
}

@-moz-keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
    10% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1); }
    20% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
}

@keyframes pulse {
    0% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
    10% {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1); }
    20% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1); }
}

.dropzone, .dropzone * {
    box-sizing: border-box; }

.dropzone {
    min-height: 150px;
    border: dashed 2px #d6d6d6;
    background: white;
    padding: 0 }

.dropzone.dz-clickable {
    cursor: pointer; }

.dropzone.dz-clickable * {
    cursor: default; }

.dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {
    cursor: pointer; }

.dropzone.dz-started .dz-message {
    display: none; }

.dropzone.dz-drag-hover {
    border: dashed 2px #5d6266; }

.dropzone.dz-drag-hover .dz-message {
    opacity: 0.5; }

.dropzone .dz-message {
    text-align: center;
    margin: 2em 0; }

.dropzone .dz-preview {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 16px;
    min-height: 100px; }

.dropzone .dz-preview:hover {
    z-index: 1000; }

.dropzone .dz-preview:hover .dz-details {
    opacity: 1; }

.dropzone .dz-preview.dz-file-preview .dz-image {
    border-radius: 20px;
    background: #999;
    background: linear-gradient(to bottom, #eee, #ddd); }

.dropzone .dz-preview.dz-file-preview .dz-details {
    opacity: 1; }

.dropzone .dz-preview.dz-image-preview {
    background: white; }

.dropzone .dz-preview.dz-image-preview .dz-details {
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear; }

.dropzone .dz-preview .dz-remove {
    font-size: 14px;
    text-align: center;
    display: block;
    cursor: pointer;
    border: none; }

.dropzone .dz-preview .dz-remove:hover {
    text-decoration: underline; }

.dropzone .dz-preview:hover .dz-details {
    opacity: 1; }

.dropzone .dz-preview .dz-details {
    z-index: 20;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    font-size: 13px;
    min-width: 100%;
    max-width: 100%;
    padding: 2em 1em;
    text-align: center;
    color: rgba(0, 0, 0, 0.9);
    line-height: 150%; }

.dropzone .dz-preview .dz-details .dz-size {
    margin-bottom: 1em;
    font-size: 16px; }

.dropzone .dz-preview .dz-details .dz-filename {
    white-space: nowrap; }

.dropzone .dz-preview .dz-details .dz-filename:hover span {
    border: 1px solid rgba(200, 200, 200, 0.8);
    background-color: rgba(255, 255, 255, 0.8); }

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
    overflow: hidden;
    text-overflow: ellipsis; }

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
    border: 1px solid transparent; }

.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {
    background-color: rgba(255, 255, 255, 0.4);
    padding: 0 0.4em;
    border-radius: 3px; }

.dropzone .dz-preview:hover .dz-image img {
    -webkit-transform: scale(1.05, 1.05);
    -moz-transform: scale(1.05, 1.05);
    -ms-transform: scale(1.05, 1.05);
    -o-transform: scale(1.05, 1.05);
    transform: scale(1.05, 1.05);
    -webkit-filter: blur(8px);
    filter: blur(8px); }

.dropzone .dz-preview .dz-image {
    border-radius: 20px;
    overflow: hidden;
    width: 120px;
    height: 120px;
    position: relative;
    display: block;
    z-index: 10; }

.dropzone .dz-preview .dz-image img {
    display: block; }

.dropzone .dz-preview.dz-success .dz-success-mark {
    -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
    animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }

.dropzone .dz-preview.dz-error .dz-error-mark {
    opacity: 1;
    -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
    animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }

.dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {
    pointer-events: none;
    opacity: 0;
    z-index: 500;
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    margin-left: -27px;
    margin-top: -27px; }

.dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {
    display: block;
    width: 54px;
    height: 54px; }

.dropzone .dz-preview.dz-processing .dz-progress {
    opacity: 1;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear; }

.dropzone .dz-preview.dz-complete .dz-progress {
    opacity: 0;
    -webkit-transition: opacity 0.4s ease-in;
    -moz-transition: opacity 0.4s ease-in;
    -ms-transition: opacity 0.4s ease-in;
    -o-transition: opacity 0.4s ease-in;
    transition: opacity 0.4s ease-in; }

.dropzone .dz-preview:not(.dz-processing) .dz-progress {
    -webkit-animation: pulse 6s ease infinite;
    -moz-animation: pulse 6s ease infinite;
    -ms-animation: pulse 6s ease infinite;
    -o-animation: pulse 6s ease infinite;
    animation: pulse 6s ease infinite; }

.dropzone .dz-preview .dz-progress {
    opacity: 1;
    z-index: 1000;
    pointer-events: none;
    position: absolute;
    height: 16px;
    left: 50%;
    top: 50%;
    margin-top: -8px;
    width: 80px;
    margin-left: -40px;
    background: rgba(255, 255, 255, 0.9);
    -webkit-transform: scale(1);
    border-radius: 8px;
    overflow: hidden; }

.dropzone .dz-preview .dz-progress .dz-upload {
    background: #333;
    background: linear-gradient(to bottom, #666, #444);
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 0;
    -webkit-transition: width 300ms ease-in-out;
    -moz-transition: width 300ms ease-in-out;
    -ms-transition: width 300ms ease-in-out;
    -o-transition: width 300ms ease-in-out;
    transition: width 300ms ease-in-out; }

.dropzone .dz-preview.dz-error .dz-error-message {
    display: block; }

.dropzone .dz-preview.dz-error:hover .dz-error-message {
    opacity: 1;
    pointer-events: auto; }

.dropzone .dz-preview .dz-error-message {
    pointer-events: none;
    z-index: 1000;
    position: absolute;
    display: block;
    display: none;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -ms-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    border-radius: 8px;
    font-size: 13px;
    top: 130px;
    left: -10px;
    width: 140px;
    background: #be2626;
    background: linear-gradient(to bottom, #be2626, #a92222);
    padding: 0.5em 1.2em;
    color: white; }

.dropzone .dz-preview .dz-error-message:after {
    content: '';
    position: absolute;
    top: -6px;
    left: 64px;
    width: 0;
    height: 0;
}

.costItemImage { z-index: 1; opacity: 0.3; left: 0; top: 0; bottom: 0; right: 0; background-size: contain; display: block; height: 100%; width: 100%;transition: transform .2s;}

.costItemImage:hover, .costItemImage.active {
    transform: scale(1.05); opacity: 1;
}

.costItemImage.ui-selecting::after { position: absolute; left: -3px; right: -3px; top: -3px; bottom: -3px; content: ""; display: block; background-color: rgba(244, 255, 17, 0.5)}

.costItemImage.ui-selected::after { position: absolute; left: -3px; right: -3px; top: -3px; bottom: -3px; content: ""; display: block;
    background-color: rgba(115, 216, 63, 0.80)}

.costItem { position: absolute; background-size: contain; background-position: center center;}

.costDimensionsItem { display: inline-block; line-height: 10px; background: #000; color: #fff; padding: 2px; border-radius: 3px; font-size: 10px;}

.costLedCount { display: inline-block; line-height: 10px; background: #de2d0f; color: #fff; padding: 2px; border-radius: 3px; font-size: 10px;}

.centerOrta { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 6;}

.altOrta { position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: -20px; z-index: 6; }

.leftOrta { position: absolute; top: 50%; -webkit-transform: translateY(-50%) rotate(-90deg); transform: translateY(-50%) rotate(-90deg); left: -25px; z-index: 6; }

input:focus, textarea:focus, select:focus {
    outline: none !important;
}

.projectNo { padding: 5px; border-radius: 3px; background: #2B81AF; color: #fff; font-size: 16px; line-height: 22px; text-align: center;}

.type_msg {
    border-top: 1px solid #c4c4c4;
    position: relative;
}

.input_msg_write input {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    color: #4c4c4c;
    font-size: 15px;
    min-height: 48px;
    width: 100%;
    outline: none;
}

.msg_send_btn {
    background: #05728f none repeat scroll 0 0;
    border: none;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    height: 33px;
    position: absolute;
    right: 0;
    top: 11px;
    width: 33px;
}

.noRecords { text-align: center; padding: 25px 0}

.noRecords img { max-width: 35%; margin-bottom: 25px;}

.received_msg {
    display: inline-block;
    padding: 0 0 0 10px;
    vertical-align: top;
    width: 92%;
}

.received_withd_msg p {
    background: #ebebeb none repeat scroll 0 0;
    border-radius: 0 15px 15px 15px;
    color: #646464;
    font-size: 14px;
    margin: 0;
    padding: 5px 10px 5px 12px;
    width: 100%;
}

.time_date {
    color: #747474;
    display: block;
    font-size: 12px;
    margin: 8px 0 0;
}

.received_withd_msg {
    width: 57%;
}

.mesgs {
    float: left;
    padding: 30px 15px 0 25px;
    width: 70%;
}

.sent_msg p {
    background: #0465ac;
    border-radius: 12px 15px 15px 0;
    font-size: 14px;
    margin: 0;
    color: #fff;
    padding: 5px 10px 5px 12px;
    width: 100%;
}

.outgoing_msg {
    overflow: hidden;
    margin: 26px 0 26px;
}

.sent_msg {
    float: right;
    width: 46%;
}

.whiteCard { padding: 0 10px 10px 10px; margin-bottom: 10px; border-radius: 3px; border: solid 2px #e5e5e5; background-color: #fff;}

.whiteCard:hover { background-color: #faf1e1;}

.whiteBox { padding: 15px; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 1px, rgba(0, 0, 0, 0.14) 0px 1px 4px; background-color: #fff;}

.d-flex {

    display: -ms-flexbox !important;
    display: flex !important;

}

.mb-5 { margin-bottom: 5px;}

.justify-content-between {

    -ms-flex-pack: justify !important;
    justify-content: space-between !important;

}

.display-5 {
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
}

.text-dark {
    color: #324148 !important;
}

.d-block {
    display: block !important;
}

.align-items-center { -ms-flex-align: center !important; align-items: center !important }

.homeBoxVertical { height: 350px; overflow-y: auto; overflow-x: hidden;}

.homeMessages {
    padding: 15px;
    background-image: url(../img/icons/newMessages.svg);
    background-repeat: no-repeat;
    background-position: 15px center;
}

.blueBox {
    color: #FFFFFF;
    border-color: #1568b2;
    padding: 15px;
    margin-bottom: 10px;
    background: linear-gradient(0deg, #0b4182 1%, #166bb5 100%);
    box-shadow: 0 5px 30px -5px rgba(37, 45, 51, .5);
}

.blueBoxTitle { font-size: 20px; font-weight: 700;}

.blueBoxContent { font-size: 14px; line-height: 20px; font-weight: 400;}

.blueBoxContent a, .blueBoxContent a:hover { color: #fff; font-weight: 700}

.blueBoxContent a:hover { text-decoration: underline}

.blink {
    animation: blinker 1s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: .5;
    }
}
#bottomActions {
 position: fixed;
 z-index: 6;
 left: 0;
 padding: 2rem 2rem 2rem 100px;
 background: #fff;
 box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
 right: 0;
 bottom: 0;
 transform: translateY(100%);
 transition: all .2s;
}
#bottomActions.active {
 transform: translateY(0);
}
.tableHeader {
 background:#F5F6FA;
 font-weight: bold;
 color: #8094ae;
 padding: 1rem 0;
 border-radius: 2px 2px 0 0;
 border-top: solid 1px #dbdfea !important;
}
.tableBody {
 padding: .5rem 0;
 border-top: solid 1px #dbdfea !important;
 position: relative;;
}
.tableBody:hover {
 background-color: #f5f5f5;box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset;
}

.colColumn { display:block; padding: .5rem 1rem; border-left: dashed 1px #919DA8; }
.tableBody .colColumn { padding: .2rem 1rem}
.colColumn.noBorder { border-left: none;}
#treeResult, .tableBody, .tableBodySub {
 position: relative;
}

.pdiv-0 {
 right: -8rem;
}
.pdiv-1 {
 right: -12rem
}
.pdiv-2 {
 right: -16rem
}
.pdiv-3 {
 right: -20rem
}
.pdiv-4 {
 right: -24rem
}
.routeNotFound {
 display: inline-block;
 padding: .2rem .5rem;
 border-radius: 3px;
 background-color: var(--color-orange);
 color: #fff;
 font-size: .9rem;
}
.pdivContainer {position: relative; height: 100%; width: 2rem}
.pdivContainer::after {
 position: absolute;
 right: 100%;
 border-radius: 6px;
 height: 1px;
 content: "";
 top: 0;
 display: inline-block;
}
.pdivContainer::before {
 position: absolute;
 right: 100%;
 display: inline-block;
 border-radius: 6px;
 height: 1px;
 content: "";
 bottom: 0;
}

.pdiv-0 {
 right: -8rem;
}
.pdiv-1 {
 right: -12rem
}
.pdiv-2 {
 right: -16rem
}
.pdiv-3 {
 right: -20rem
}
.pdiv-4 {
 right: -24rem
}
.productionInfoDiv {
 position: absolute;
 width: 4rem;
 padding: 0;
 top: -3.8rem;
 bottom: .2rem;
}
.productionInfoDiv.pdiv-0 {
 border-left: dashed 2px #E65239;
}
.productionInfoDiv.pdiv-1  {
 border-left: dashed 2px #EECE59;
}
.productionInfoDiv.pdiv-2 {
 border-left: dashed 2px #3AA99E;
}
.productionInfoDiv.pdiv-3 {
 border-left: dashed 2px #1F6096;
}
.productionInfoDiv.pdiv-4 {
 border-left: dashed 2px #163D5C;
}
.pdiv-0 .pdivContainer::after, .pdiv-0 .pdivContainer::before {
 border-top: dashed 2px #E65239;
 width: 6rem;
}
.pdiv-1 .pdivContainer::after, .pdiv-1 .pdivContainer::before {
 border-top: dashed 2px #EECE59;
 width: 10rem;
}
.pdiv-2 .pdivContainer::after, .pdiv-2 .pdivContainer::before {
 border-top: dashed 2px #3AA99E;
 width: 14rem;
}
.pdiv-3 .pdivContainer::after, .pdiv-3 .pdivContainer::before {
 border-top: dashed 2px #1F6096;
 width: 18rem;
}
.pdiv-4 .pdivContainer::after, .pdiv-4 .pdivContainer::before {
 border-top: dashed 2px #163D5C;
 width: 22rem;
}

.pDiv {
 position: absolute;
 left: 50%;
 top: 50%;
 transform-origin: center;
 transform: translate(-50%, -50%) rotate(90deg);
 display: inline-block;
 white-space:  nowrap !important;
}
.zDepth-0 {
 background-color: rgba(0,0,0,.10);
}
.zDepth-1 {
 background-color: rgba(0,0,0,.08);
}
.zDepth-2 {
 background-color: rgba(0,0,0,.06);
}
.zDepth-3 {
 background-color: rgba(0,0,0,.04);
}
.zDepth-4 {
 background-color: rgba(0,0,0,.02);
}
.text-ellipsis {
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
}
.signatureBox{
 background: #fff;
 border-radius: 3px;
 margin-bottom: 5px;
 padding: 1rem;
}
.signatureUser {
 font-size: 1.5rem;
 font-weight: 700;
}
#ajaxPanel {
 box-shadow: 0 0 12px 0 rgba(0,0,0,.1),0 10px 30px 0 rgba(0,0,0,.2);
 background-color: #fff;
 padding:120px 2rem 2rem 2rem;
 position: fixed;
 left: 0;
 top: 0;
 bottom: 0;
 border-left: solid 2px var(--color-orange);
 z-index: 20;
 transition: 0.5s;
 width: 100%;
 margin-left: 100%;
 overflow: auto;
}
#ajaxPanel.half {
 margin-left: 50%;
 width: 50%;
}

#ajaxPanel.quarter {
 margin-left: 75%;
 width: 25%;
}
#ajaxPanel.full {
 margin-left: 0;
}
@media (max-width: 1200px) {
 #ajaxPanel.half {
  margin-left: 30%;
  width:70%;
 }
 #ajaxPanel.quarter {
  margin-left: 50%;
  width: 50%;
 }
}
@media (max-width: 479px) {
 #ajaxPanel.half,  #ajaxPanel.quarter {
  margin-left: 0;
  width: 100%;
 }
}
@media (max-width: 1200px) {
 #settingsPanel, #ajaxPanel {
  padding-top: 70px;
 }
}
#ajaxHeader {
 margin-bottom: 2rem;
 border-bottom: solid 1px #d6d6d6;
 padding-bottom: 1rem;
}
@media screen and (max-height: 450px) {
 .sidenav {
  padding-top: 15px;
 }

}
#closeAjaxPanel {
 width: 24px; height: 24px; display: inline-block;
 background-image: url("images/times.svg");
 background-position: center;
 background-size: 24px 24px;
 transition: .3s;
}
#closeAjaxPanel:hover {
 transform: rotateZ(180deg);
}
#ajaxPanelTitle {
 font-weight: 700;
 color: var(--color-theme-900);
 font-size: 14px;
}