@import url('https://fonts.googleapis.com/css?family=Montserrat:200,400,700&display=swap&subset=latin-ext');


:root {
  --main-color: rgb(17, 47, 103);
  --prze01-color: rgba(66,160,255, 0.95);
  
  --prze0-color: rgba(66,160,255, 0);
  --prze02-color: rgba(66,160,255, 0.2);
  --prze05-color: rgba(66,160,255, 0.5);
  --prze08-color: rgba(66,160,255, 0.8);
    --nieb01: rgb(17, 47, 103);
    --szar01: rgb(203, 207, 212);
    --szar02: rgb(237, 238, 240);
    --szar03: rgb(180, 180, 180);

    --czer01: #da0909;
    --czer02: rgb(237, 32, 36);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
*:before, *:after {
  box-sizing: border-box;
}

body, html
{
 height:100%;
}

body {
	/*font-family: Verdana,Arial, Helvetica, sans-serif;*/
	font: 400 16px/1.5em 'Montserrat', 'Helvetica', sans-serif;
	color: #bdbdbd;
	text-decoration: none;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
	background: #eaeaea;
	position: relative;
}

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

.clearfix {
  *zoom: 1;
}
.clearfix:before, .clearfix:after {
  content: ' ';
  display: table;
}
.clearfix:after {
  clear: both;
}

.nieb01
{
  color: var(--main-color);
}

.szar01
{
  color: var(--szar01);
}

.szar03
{
  color: var(--szar03);
}

.back01
{
  background-image: url("/common/img/background01.jpg");
  background-repeat:no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index:-1;
}

.back02
{
  background-image: url("/common/img/background02.jpg");
  background-repeat:no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index:-1;
}

.log_container
{
  left: 75%;
  position: fixed;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: rgba(0,0,0,0.2);
  transition: all 300ms linear;
}

.log_container.card-hidden, .log_container02.card-hidden
{
  opacity: 0;
  /*transform: translate3d(0, -60px, 0);*/
}

.log_container02
{
  left: 75%;
  position: fixed;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: rgba(0,0,0,0.8);
  transition: all 300ms linear;
  
}

.log_container02 .footer02
{
  color: #ccc;
}

.footer02 a
{
  color: #dfdfdf;
  transition: 1s;
}

.footer02 a:hover
{
  color: #ccc;
}

a.footer01
{
  color: #fff;
  transition: 1s;
}

.log_container02 .footer02 a, #login-form .warn01 a
{
  color: #fff;
}

.footer02 a:hover, #login-form .warn01 a:hover
{
  text-decoration: underline;
}



.lang_control
{
  position: absolute;
  top: 15px;
  left: calc(75% + 86px);
  cursor: pointer;
}

.lang_control:before
{
  content: "\2193";
  color: red;
}

.lang_control_change
{
  position: absolute;
  top: 40px;
  left: calc(75% + 24px);
  width: 100px;
  transition: opacity 600ms, visibility 600ms;
  visibility: hidden;
  opacity:0;
}

.lang_control_change a
{
  display:block;
  color: #fff;
  font-size: 0.9em;
  text-transform: uppercase;
  text-align:right;
  transition: 0.5s;
}

.lang_control_change a:hover
{
  color: red;
}

@media screen and (max-width: 750px)
{
  .log_container, .log_container02
  {
    left: 50%;
  }
  
  .lang_control
  {
    left: calc(100% - 50px);
  }
  
  .lang_control_change
  {
    left: calc(100% - 120px);
    top: 50px;
  }
  
  .lang_control_change a
  {
    font-size: 1.3em;
    margin-bottom: 6px;
  }
}

#login-form
{
  width: 330px;
}

#login-form h3 {
  background-color: rgba(0,0,0, 0.4);
  border-radius: 5px 5px 0 0;
  color: #fff;
  font-size: 14px;
  padding: 20px;
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
}

#login-form fieldset {
  background: rgba(0,0,0, 0.2);
  border: none;
  padding: 20px;
  position: relative;
  
}



#login-form input {
  font-size: 14px;
  color: #fff;
}

#login-form input::placeholder
{
  color: #dfdfdf;
}

#login-form input[type="text"],
#login-form input[type="password"] {
  border: 1px solid rgba(255,255,255,0.2);
  padding: 12px 10px;
  width: 100%;
  background-color: rgba(255,255,255,0.1);
}

#login-form input[type="text"] {
  border-radius: 3px 3px 0 0;
}

#login-form input[type="password"] {
  
  
}

#login-form input[type="submit"] {
  background: var(--prze02-color);
  
  color: #fff;
  float: right;
  font-weight: bold;
  margin-top: 20px;
  padding: 12px 20px;
  border: 0;
}

#login-form input[type="submit"]:hover {
  background: var(--prze05-color);
}

#login-form input[type=text], #login-form textarea, #login-form input[type=password] {
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  filter: none;
}

#login-form input[type=text]:-webkit-autofill, #login-form input[type=password]:-webkit-autofill {
  background: none;
}
#login-form input[type=text]:autofill, #login-form input[type=password]:-webkit-autofill {
  background: none;
}
 
#login-form input[type=text]:focus, #login-form textarea:focus, #login-form input[type=password]:focus {
  border: 1px solid rgba(255,255,255,1);
  background-color: rgba(0,0,0,0.5);
}



#login-form .footer02
{
  
  font-size: 14px;
  /*margin-top: 16px;*/
  text-align: center;
  /*background-color: rgba(0,0,0, 0.4);*/
  /*padding: 16px 20px;*/
  padding: 0px 20px 16px;
  border-radius: 0 0 5px 5px;
  text-align:left;
}

#login-form .footer02 hr
{
  width: 80%;
  margin: 0 auto 12px;
  color: rgba(200, 200, 200, 0.3);
}


#login-form .warn01
{
  font-size: 12px;
  padding: 16px 20px;
  text-align: center;
  color: #ededed;
}

#login-form .warn01 a
{
  font-weight: 700;
}

#login-form .warn02
{
  font-size: 12px;
  padding: 0 20px;
  color: #efefef;
}

#login-form .warn02 ul {
  list-style: none; /* Remove default bullets */
  padding-left: 14px;
}

#login-form .warn02 ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: red; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
  transition: 0.5s;
}

#login-form .warn02 ul li.ziel01::before {
  color: green;
}

.logo_gora_01
{
  position: absolute;
  top:10px;
  left: calc(50% - 600px);
}

@media screen and (max-width: 1200px)
{
  .logo_gora_01
  {
    left: 20px;
  }
}

.top_head01
{
  background-color: rgba(9,32,92, 0.7);
  color: #fff;
  padding: 8px 0;
}


.top_head01 a
{
  color: #fff;
  font-size: 0.8em;
  text-transform: uppercase;
}

.cont01
{
  width: 1200px;
  margin: 0 auto;
}

.top_head01 .cont01
{
  text-align: right;
}

h1
{
  font-weight: 400;
  margin: 36px 0 16px;
  font-size: 1.7em;
}

h2
{
  font-weight: 400;
  margin: 8px 0;
  font-size: 1.5em;
}

.bbox01
{
  padding: 24px;
  background-image: linear-gradient(to bottom right, #eee 0%, #fafafa 100%);
  border: 1px solid #cacaca;
  text-align: center;
  margin-bottom: 24px;
}

.bbox01 img
{
  margin: 12px;
  box-shadow: 0px 8px 8px -6px rgba(25,55,99,0.4);
  transition: 0.5s;
}

.bbox01 img:hover
{
  box-shadow: none;
}

.bbox01 a
{
  color: #3498db;
  text-decoration: none;
}

.bbox01 a:hover
{
  text-decoration: underline;
}

.badge
{
  transition: 1s;
}

#logo06
{
  width: 170px;
  padding-bottom: 6px;
}


.has-danger .form-check-label .form-check-sign .check
{
  border: 1px solid rgba(255,0,0, .54);
}

footer ul.white01 li a, .copyright
{
  color: #fff;
}

.white01 a:hover
{
  color: #ccc;
}

.card .card-footer#noflex01
{
  display: block;
}

.wrapper .login-page .card-login .card-message01
{
  padding: 0 30px;
}

.wrapper .login-page .card-login .card-message02
{
  margin-bottom: 20px;
}

input.bez_md01::placeholder
{
  line-height: inherit;
}

.bmd-form-group input.bez_md01::placeholder
{
  line-height: 24px;
}

div.content.tekst01
{
  padding-top: 50px;
}

tr.head01 td
{
  background-color: var(--szar02);
}

.ok01
{
  color: var(--nieb01);
  transition: all 300ms;
}

.ok01:before
{
  content: "check_circle_outline";

}

.notok01
{
  color: var(--szar01);
  transition: all 300ms;
}

.notok01:before
{
  content: "highlight_off";
}

.nieb01
{
  color: var(--nieb01);
}

.btn_perm_change, .btnZatw
{
  cursor: pointer;
}

.card a.btn
{
  /*color: #fff !important;*/
}

.select01
{
  border: 0;
  outline: none;
  text-transform: uppercase;
  background: #efefef;
  padding: 2px 6px;
}

.select02
{
  border: 1px solid #000;
  outline: none;
  background: #fff;
  padding: 1px 6px;
}

#hourIntended
{
  width: 60px;
  margin-left: 8px;
}

.badge_ziel01
{
  background-color: #fff;
  color: #4caf50 !important;
  border: 1px solid #4caf50;
}


.badge_czer01
{
  background-color: #fff;
  color: #f44336 !important;
  border: 1px solid #f44336;
}

.badge_czer02
{
  background-color: #fff;
  color: #f44336 !important;
  border: 1px solid #f44336;
  padding: 2px 6px 1px;
  text-transform: uppercase;
}

.badge_orange01
{
  background-color: #fff;
  color: #ff941a !important;
  border: 1px solid #ff941a;
  padding: 2px 8px;
}

.badge_szar01
{
  background-color: #fff;
  color: #484848 !important;
  border: 1px solid #484848;
  padding: 2px 8px;
}

.btn-granat01
{
  background-color: #fff !important;
  border: 1px solid #112f67 !important;
  color: #112f67 !important;
}

.btn-granat01:hover
{
  background-color: #112f67 !important;
  border: 1px solid #112f67 !important;
  color: #fff !important;
}

.btn-ziel01
{
  background-color: #fff !important;
  border: 1px solid #4caf50 !important;
  color: #4caf50 !important;
}

.btn-ziel01:hover
{
  background-color: #4caf50 !important;
  border: 1px solid #4caf50 !important;
  color: #fff !important;
}

.btn-czer01
{
  background-color: #fff !important;
  border: 1px solid #f44336 !important;
  color: #f44336 !important;
}

.btn-czer01:hover
{
  background-color: #f44336 !important;
  border: 1px solid #f44336 !important;
  color: #fff !important;
}

.btn-szar01
{
  background-color: #fff !important;
  border: 1px solid #999 !important;
  color: #999 !important;
}

.btn-szar01:hover
{
  background-color: #999 !important;
  border: 1px solid #999 !important;
  color: #fff !important;
}

div.ziel01, span.ziel01, .ziel01
{
  color: #4caf50;
}

div.czer01, span.czer01, label.czer01
{
  color: #f44336;
}

.dataTable > thead > tr > th.searchable01
{
  padding: 0px;
}

#datatables tfoot input, #datatables thead input {
        width: 130px;
        padding: 2px 4px;
        box-sizing: border-box;
        font-size: 0.85em;
    }

#datatables tfoot input.wid50, #datatables thead input.wid50
{
  width: 40px;
}

#datatables tfoot {
        display: table-header-group;
    }

table.table-male-litery tbody tr td {
  vertical-align: top;
  font-size: 12px;
}

table#datatables tbody tr td
{
  border-right: 1px solid rgba(0, 0, 0, 0.06);
}

.nowrap01
{
  white-space: nowrap;
}

.resize01
{
  resize: horizontal;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width:12vw;
}



@media (min-width: 1600px)
{
  .resize01
  {
    max-width:5vw;
  }

  .max50pro
  {
    max-width: 50% !important;
  }
}

@media (min-width: 2000px)
{
  .resize01
  {
    max-width:10vw;
  }
}

#img_prv01, .setProw
{
  cursor: pointer;
}

#img_change01
{
  position: absolute;
  top: 34px;
  left: calc(50% - 48px);
  opacity: 0;
  transition: all 500ms linear;
}

.glow01
{
  text-transform: uppercase;
  color: #000;
}

.podp01
{
  color: #888;
  font-size: 0.9em;
}

.toolbar .form-group
{
  padding-bottom:0px;
}

.table thead.th01 tr th
{
  font-size: 0.6rem;
  text-transform: uppercase;
}


.searchable01 input
{
  font-size: 1.2em;
  padding: 0px 4px;
}

@media screen and (max-width: 768px),(max-height: 58px)
{

}


@media screen and (max-width: 992px)
{

  .dropdown-menu a.dropdown-item
  {
    color: #fff;
  }

}
@media screen and (max-width: 500px)
{
  #logo01
  {
    width: 200px;
  }
}

@media screen and (min-width: 1020px)
{
  
  .card-wizard .tab-content
  {
     min-height: 200px !important;
  }
}

div.dataTables_scrollBody thead
{
  height:1px;
}

.dataTables_scrollBody > table > thead > tr {
    visibility: collapse;
    height: 0px !important;
    
}

.cars01 div.dataTables_scrollBody
{
  /*overflow-y: hidden !important;*/
}

.dataTables_scrollHeadInner table{ margin-bottom: 0px !important; }


div.dataTables_scrollBody table#datatables
{
  margin-bottom: 16px !important;
}
	
div.selectize-dropdown {
  z-index: 2001; }

.selectize-dropdown-content div
{
  padding: 4px 6px;
}
  
table.dataTable tbody > tr.selected:hover, table.dataTable tbody > tr:hover > .selected {
    background-color: #25649a;
}

a.marginLeft {
        margin-left: 1em;
    }

div.DTE button.btn.bezFloat01, div.DTE div.DTE_Form_Buttons button.bezFloat01, .inlineblock01
{
  float:none;
  display:inline-block;
}


.wrapper > .main-panel > .bezPTop
{
  margin-top:15px;
}

div.select_option01
{
  margin: 2px;
  padding: 2px 4px;
}

span.select_firma01
{
  display:block;
  font-size: 1.1em;
}

span.select_name01
{
  display:block;
  font-size: .9em;
}

span.select_firma02
{
  font-weight: bold;
  font-size: 1.1em;
}

span.select_name02
{
  font-size: .9em;
}

/* -------------------------------------------- editor form */

#customForm {

}
 
#customForm fieldset {
    border-bottom: 1px solid #aaa;
    margin: 0.5em;
}
 
#customForm div.DTE_Field {
    padding: 5px;
}


div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_mileage, div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_rok_prod
{
  display:inline-block;
  width: 49%;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_zakupCena, 
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_sprzedazCena,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_ek,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztDodatkowy,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztTransportu
{
  display:inline-block;
  width: 46.5%;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_engine\.id
{
  display:inline-block;
  width: calc(100% - 80px);
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_engine\.id .DTE_Label
{
  width: 250px;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_engine\.id .DTE_Field_Input
{
  width: 503px;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_gear\.id
{
  display: inline-block;
  width: 70px;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_zakupCena .DTE_Field_Input, 
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_sprzedazCena .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_ek .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztDodatkowy .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztTransportu .DTE_Field_Input
{
  width: 130px;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_zakupCenaWaluta\.id,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_sprzedazWaluta\.id,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_ekWaluta\.id,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztDodatkowyWal\.id,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztTransportuWal\.id

{
  display:inline-block;
  width: 20%;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_zakupCenaWaluta\.id .DTE_Label,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_sprzedazWaluta\.id .DTE_Label,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_ekWaluta\.id .DTE_Label,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztDodatkowyWal\.id .DTE_Label,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztTransportuWal\.id .DTE_Label,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_gear\.id .DTE_Label
{
  display:none;
}

div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_zakupCenaWaluta\.id .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_sprzedazWaluta\.id .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_ekWaluta\.id .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztDodatkowyWal\.id .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_kosztTransportuWal\.id .DTE_Field_Input,
div.DTE_Body div.DTE_Body_Content #customForm div.DTE_Field_Name_gear\.id .DTE_Field_Input
{
  width: 99%;
}

/* ----------------------------------------- koniec editor form */

ul.wypdod01
{
 list-style-type: none;
}

ul.wypdod01 li
{
  padding: 2px 0 2px 24px;
  position: relative;
}

ul.wypdod01 li input
{
  position: absolute;
  left: 4px;
  top: 7px;
}

.checked01 label
{
  color: var(--main-color);
} 

.dt-buttons
{
  float: left;
}

h2.oferta01
{
  font-size: 20px;
}

h2.oferta01 span
{
  font-size: 12px;
}

.pop-outer, .pop-outer-full
{
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index:1030;
}

.pop-inner {
    background-color: #fff;
    width: 95%;
    max-width: 1000px;
    height: 75%;
    padding: 25px;
    margin: 5% auto;
    z-index:11;
}

.pop-outer-full .pop-inner {
  height: 87%;
  max-width: 1200px;
  margin: 2% auto;
  padding: 0;
  width: 100%;
  position: relative;
}

.pop-outer-full .pop-inner .close {
  position: absolute;
  top: 14px;
  right: 14px;
}

.pop-outer-full .row
{
  margin-top:10px;
}

.pop-inner11 {
  background-color: #fff;
  width: 95%;
  max-width: 1000px;
  height: 75%;
  padding: 25px;
  margin: 5% auto;
  z-index:11;
}

.pop-inner11 #popup-p {
  max-height: 80%;
}

#popup-p
{
  height: calc(100% - 135px);
  overflow: auto;
}

.pop-outer-full #popup-body01
{
  height: calc(100% - 100px);
  overflow: auto;
  margin-bottom: 0px;
  padding: 14px 16px;
}

.pop-outer-full #popup-header01, .pop-outer-full #popup-foot01
{
  height: 50px;
  background: rgb(242,240,240);
  /*background: linear-gradient(45deg, rgba(236,233,233,1) 0%, rgba(250,250,250,1) 100%);*/
  margin-bottom: 0px;
}

.pop-outer-full #popup-header01
{
  border-bottom: 1px solid #777;
  font-size: 1.3em;
  padding: 14px 16px;

}

.pop-outer-full #popup-foot01
{
  border-top: 1px solid #777;
}

#popup-p table
{
  width: 100%;
  margin-top: 16px;
}

tr.head02 td
{
  color: var(--szar03);
  text-transform: uppercase;
  font-size: 0.8em;
  text-align: center;
}

#popup-p table tr:hover 
{
  background-color:#f9f9f9;
}

#popup-p table td
{
  padding: 2px 12px;
  border-bottom: 1px solid #ccc;
}

/* małe okno -----------------------------------------------------------------*/

.pop-outer-sm
{
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index:1030;
}

.pop-inner-sm {
    background-color: #fff;
    width: 360px;
    height: 200px;
    padding: 25px;
    margin: 5% auto;
    z-index:11;
}

#popup-p-sm
{
  max-height: 193px;
  overflow: auto;
}

#popup-p01-sm
{
  font-size: 0.8rem;
  margin-bottom: 2px;
}



#popup-p-sm table
{
  width: 100%;
}

#popup-p-sm table tr:hover 
{
  background-color:#f9f9f9;
}

#popup-p-sm table td
{
  padding: 2px 12px;
  border-bottom: 1px solid #ccc;
}

#popup-h2-sm, .pop-inner-sm #popup-h2, #pop-inner-smpopup-h2
{
  font-size: 1.25rem;
  margin-bottom: 4px;
  cursor: move;
}

td.wypDod
{
  cursor:pointer;
}

td.prowizjaPosrednikView, td.kontraktView, td.wstProwizjaHandView, td.zakupPosrednikView, td.uwagiView, td.rezerView, td.dataPlatnosciProformy, td.proformaZaplacono, td.proformaNr, td.prowizjaIngerencjaView, td.kosztRejestracjiView, td.kosztUpowaznieniaView, td.kosztUbezpieczeniaView, td.kosztTransportuView, td.kosztDodatkowyView, td.dostepnoscView, td.zakupCenaView, td.sprzedazCenaView, td.cenaTypView, td.statusSamView, td.carView, td.kontraktView, td.rodzajUbezpieczeniaView, td.handView, td.viewDate, td.viewImg, td.viewAtt, td.kosztMZAJView, td.kosztPosrednikaView, td.zakupCenaWstepnaView, td.zakupDealerView, td.zakupSprzedawcaView, td.kontraktEnovaView, td.fakturaView, td.rokProdView, .vinUpdateView
{
  cursor: pointer;
  /*color: var(--main-color);*/
}

td.prowizjaPosrednikView:hover, td.kontraktView:hover, td.wstProwizjaHandView:hover, td.zakupPosrednikView:hover, td.rezerView:hover, td.proformaZaplacono:hover, td.prowizjaIngerencjaView:hover, td.kosztRejestracjiView:hover, td.kosztUpowaznieniaView:hover,  td.kosztUbezpieczeniaView:hover, td.kosztTransportuView:hover, td.kosztDodatkowyView:hover, td.dostepnoscView:hover, td.zakupCenaView:hover, td.zakupCenaView:hover, td.cenaTypView:hover, td.statusSamView:hover, td.carView:hover, td.kontraktView:hover, td.rodzajUbezpieczeniaView:hover, td.handView:hover
{
  /*color: #000;*/
}

.selected td.prowizjaPosrednikView, .selected td.kontraktView, .selected td.wstProwizjaHandView, .selected td.zakupPosrednikView, .selected td.uwagiView, .selected td.rezerView, .selected td.dataPlatnosciProformy, .selected td.proformaZaplacono, .selected td.proformaNr, .selected td.prowizjaIngerencjaView, .selected td.kosztRejestracjiView, .selected td.kosztUpowaznieniaView, .selected td.kosztUbezpieczeniaView, .selected td.kosztTransportuView, .selected td.kosztDodatkowyView, .selected td.dostepnoscView, .selected td.zakupCenaView, .selected td.zakupCenaView, .selected td.cenaTypView, .selected td.statusSamView, .selected td.carView, .selected td.kontraktView, .selected td.rodzajUbezpieczeniaView, .selected td.handView, .selected td.viewDate, .selected td.viewImg, .selected td.viewAtt, .selected td.kosztMZAJView, .selected td.kosztPosrednikaView, .selected td.zakupCenaWstepnaView, .selected td.zakupDealerView, .selected td.zakupSprzedawcaView, .selected td.kontraktEnovaView, .selected td.fakturaView, .selected td.rokProdView
{
  color: #fff;
}


td.right01
{
  text-align: right;
}

.right01
{
  text-align: right;
}

.link01, .link03
{
  cursor: pointer;
  color: var(--main-color);
  text-decoration: none;
  text-transform: uppercase;
}

.link01:hover, .link03:hover
{
  text-decoration: underline;
}

a.link04
{
  padding: 3px 6px;
}

.link04
{
  cursor: pointer;
  color: #fff;
  text-decoration: none;
  font-size: 0.9em;
  text-transform: uppercase;
  border: 1px solid #fff;
  -webkit-transition: .4s;
  transition: .4s;
  margin: 0 4px;
}

.link04:hover
{
  background-color: #fff;
  color: var(--main-color) !important;
  
}

.link05
{
  cursor: pointer;
  color: var(--main-color);
  text-decoration: none;
  text-transform: uppercase;
}

.link05:hover
{
  color: #fff;
  background-color: var(--main-color) !important;
  
}

.inp01
{
  width: 80px;
  padding-right: 4px;
  text-align: right;
}

.inp02
{
  width: 52px;
  padding-right: 4px;
  text-align: right;
}

.inp03
{
  height: 28px;
  padding: 2px 6px;
}

.inp04 {
  padding: 4px 8px;
  border: 1px solid #aaa;
  border-bottom: 1px solid #bbb;
  transition: 0.5s;
}

.inp04:focus {
  border-bottom: 1px solid var(--main-color);
}

.inp04::placeholder {
  color: #bbb;
}

.flex01 {
  display: flex;
  justify-content: flex-start;
  gap:16px;
}

.flex02 {
  display: flex;
  justify-content: flex-end;
  gap:16px;
}


#inp_data
{
  width: 128px;
}

.displayNone01
{
  display:none;
}

#popup-p-dodaj table th {
font-size: 0.6rem;
text-transform: uppercase;
font-weight: normal;
}

#popup-p-dodaj table th,#popup-p-dodaj table td  {
padding: 2px 6px;
}

#popup-p-dodaj02
{
  position: relative;
}

.btnGroupRight01
{
  position: absolute;
  right: 0;
}

#popup-h2, #pop-innerpopup-h2
{
  font-size: 1.5rem;
  cursor: move;
}

#selPosrednik + .selectize-control {
    width: 450px;
    display: inline-block;
}

#dodajPosrednika
{
  display: inline-block;
  margin: 0 12px 28px 6px;
  line-height: 28px;
  padding-bottom: 14px;
  vertical-align: middle;
  padding: 0 16px;
  background-color: #112f67;
  color: #fff;
  text-transform: uppercase;
  border: #112f67;
  cursor: pointer;
  font-size: 0.9em;
}

#popup-p table.tbl02 tr td, table.tbl02 tr td
{
  vertical-align: top;
  border-bottom: 1px solid #eee;
}

table.tbl02 tr:nth-child(2n) td {
    background: #fafafa;
}

table.tbl02 tr:hover td
{
  background: #f8f8f8;
}

#tekstUwagi
{
  width: 75%;
}

#labelOwn01
{
  margin: 0 16px;
  vertical-align: top;
}

#dodajUwagi, .link02, #cancelContract, #addToContract, #allFree, #allCancel, #allContract
{
  display: inline-block;
  margin: 0 6px;
  line-height: 28px;
  padding: 0 16px;
  background-color: #112f67;
  color: #fff;
  text-transform: uppercase;
  border: #112f67;
  cursor: pointer;
  font-size: 0.9em;
  vertical-align: top;
}

#cancelContract:disabled
{
  background-color: #aaa;
}

.link02:hover
{
  color: #fff;
}

#cancelAdd {
  display: inline-block;
  margin: 0 6px;
  line-height: 28px;
  padding: 0 16px;
  color: #112f67;
  background-color: #fff;
  text-transform: uppercase;
  border: #112f67;
  cursor: pointer;
  font-size: 0.9em;
  vertical-align: top;
}

#tekstPowod
{
  width: 100%;
}

#cancelContract
{
  display: block;
  margin: 0 auto;

}

.inpSearch01
{
  background-image: url('/common/img/icoSearch.svg');
  background-position: 8px 6px;
  background-repeat: no-repeat; 
  background-size: 20px 20px;
  padding: 4px 8px 4px 34px;
  border: 1px solid #ccc;
}

.inpSearch01::placeholder
{
  line-height: 1.8;
}



.bkgred01 td
{
  background-color: #fff2f2;
}

.bkgred01.selected td
{
  background-color: #5402d8;
}

.selected td a
{
  color: #fff;
}


#tableID tbody tr.bkgred01.selected td {
  color: #fff;
  background-color: maroon !important;
}

div.DTED_Lightbox_Wrapper
{
  z-index: 1100;
}

.bold01
{
  font-weight: bold;
}

table.dataTable thead .sorting::before, table.dataTable thead .sorting_asc::before, table.dataTable thead .sorting_desc::before, table.dataTable thead .sorting_asc_disabled::before, table.dataTable thead .sorting_desc_disabled::before {
  content: " " !important;
}

table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::after, table.dataTable thead .sorting_asc_disabled::after, table.dataTable thead .sorting_desc_disabled::after {
  content: " " !important;
}

.hr01
{
  margin-top: 2px;
  margin-bottom: 2px;
}

.hr02
{
  margin-top: 12px;
  margin-bottom: 2px;
}

#upowDisp
{
  margin-top:12px;
}

.propCeny01
{
  margin: 0 8px;
  display: inline-block;
}

.form-input-inline
{
  display: inline-flex;
  align-items: center;
  padding-left: 0;
  margin-right: 1.75rem;
  font-size: 14px;
  line-height: 1.42857;
  color: #AAAAAA;
  font-weight: 400;
  position: relative;
}

div.dataTables_wrapper div.dataTables_processing
{
  z-index:5;
  background-color: #fff;
}

.paginate_button
{
  padding: 0 10px;
  cursor: pointer;
}

#datatables_paginate .current
{
  font-weight:bold;
}

.divForm01
{
  line-height: 160%;
}

.divForm01 input
{
  border-top: none;
  border-left: none;
  border-right: none;
  font-size: 12px;
  padding: 12px 12px 0 12px;
  color: #777;
}

.divForm01 input::placeholder {
  opacity: .4;
}

span.deleteicon {
  position: relative;
  display: inline-flex;
  align-items: center;
}

span.deleteicon span {
  position: absolute;
  display: block;
  right: 3px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  color: #fff;
  background-color: #ccc;
  font: 13px monospace;
  text-align: center;
  line-height: 1em;
  cursor: pointer;
  bottom: 7px;
}
span.deleteicon input {
  padding-right: 18px;
  box-sizing: border-box;
}

.divForm01 input:focus {
  border-bottom: 1px solid var(--main-color);
}

.max300
{
  max-width: 300px !important;
}

.max350
{
  max-width: 350px !important;
}

.max450
{
  max-width: 450px !important;
}

.max500
{
  max-width: 500px !important;
}



.max600
{
  max-width: 600px !important;
}

.max735
{
  max-width: 735px !important;
}

.max960
{
  max-width: 960px !important;
}

.max1000
{
  max-width: 1000px !important;
}

.tableWaskie > thead > tr > td, .tableWaskie > tbody > tr > td
{
  padding: 4px 12px !important;
}

.tableWaskie02 > thead > tr > td, .tableWaskie02 > tbody > tr > td
{
  padding: 0px 12px !important;
}

.dataTable#datatables > tbody > tr > td
{
  padding: 2px 5px !important;
}

.divWid40Pro
{
  display: inline-block;
  width: 40%;
}

.divRow01
{
  padding: 8px 0 0 0;
}

.span100px
{
  display: inline-block;
  width: 80px;
  padding-right: 8px;
  text-align:right;
  vertical-align: top;
  color: #bbb;
  text-transform: uppercase;
  font-size: 10px;
}

.vertMiddle
{
  vertical-align: middle !important;
}

.formPadd01
{
  padding: 4px 8px;
}

.wid80Pro
{
  width: 80%;
}

.wid80px
{
  width: 80px;
}

textarea.height01
{
  height: 150px !important;
}

.annouImg01
{
  max-width: 400px;
  max-height: 300px;
}

.contListaFiltrow01, .contListaCol01
{
  position: relative;
  padding: 16px 8px 4px;
}

.contListaCol01
{
  text-align: right;
}

.btnListaFiltrow01, .btnListaCol01
{
  transition: background-color .3s,color .3s;
  transition-property: background-color, color;
  transition-duration: 0.3s, 0.3s;
  transition-timing-function: ease, ease;
  transition-delay: 0s, 0s;
  color: var(--main-color);
  background-color: #fff;
  padding: 8px 12px;
  border: 1px solid var(--main-color);
  white-space: nowrap;
}

.btnListaFiltrow01:hover, .btnListaCol01:hover
{
  background-color: var(--main-color);
  color: #fff;
  cursor:pointer;
}

.listaFiltrow01, .listaCol01  {
  display:none;
  flex: 0 0 auto;
  position: absolute;
  top: calc(100% + .5rem);
  width: auto;
  left: 0;
  z-index: 1200;
  width: 100%;
  min-width: 20rem;
  padding-top: .5rem;
  padding-bottom: .5rem;
  text-align: left;
  font-size: 14px;
  font-size: 1rem;
  background-color: #fff;
  border-radius: 3px;
  box-shadow: 0 0 25px 0 rgba(0,0,0,.2);
}

.listaCol01  {
  display:none;
  flex: 0 0 auto;
  position: absolute;
  top: calc(100% + .5rem);
  width: 260px;
  min-width: 260px;
  left: calc(100% - 260px);
}

.listaFiltrow01 ul, .listaCol01 ul {
  list-style-type: none;
  margin: 0;
  padding: 4px 12px;
  scrollbar-color: #79829c #fff;
  scrollbar-width: thin;
  max-height: 280px;
  overflow-y: auto;
}

.listaFiltrow01 ul li, .listaCol01 ul li {
  font-size: 12px;
}

.listaFiltrow01 ul li.head01
{
  text-transform: uppercase;
  color: #aaa;
}

.listaFiltrow01 ul li.item01, .listaCol01 ul li.item01
{
  padding-left: 12px;
}

.listaFiltrow01 ul li.item01:hover, .listaCol01 ul li.item01:hover
{
  background-color: #e4e4e4;
  cursor: pointer;
}

.badgeFilter01 {
  display: inline-flex;
  align-items: center;
  padding: .3rem 1rem;
  font-size: 12px;
  font-size: .75rem;
  background-color: #f3f4f8;
  border-radius: 13px;
  cursor: pointer;
  margin-left: 10px;
}

.badgeFilter01::after {
    content: "\2716";
    padding-left: 6px;
}

#detailListaFiltrow01
{
  display:none;
}

#headDetailListaFiltrow01
{
  padding: 4px 12px;
  cursor: pointer;
  font-size: 12px;
  text-transform: uppercase;
}



#headDetailListaFiltrow01::before
{
  content: "\2190";
  padding-right: 4px;
  vertical-align: top;
  line-height: 20px;
}

#bodyDetailListaFiltrow01
{
  padding: 8px 12px;
  font-size: 14px;
  scrollbar-color: #79829c #fff;
  scrollbar-width: thin;
  max-height: 280px;
  overflow-y: auto;
}

#bodyDetailListaFiltrow01 label
{
  cursor: pointer;
  display: block;
}

#headCol01
{
  padding: 4px 12px;
}

#headCol01 input#inputSearchCol01
{
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 1px solid #999;
  font-size: 12px;
  padding: 0px 52px 0 12px;
  color: #777;
  width: 200px;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 175px center;
}

input#inputSearchFlt01
{
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 1px solid #999;
  font-size: 12px;
  padding: 0px 52px 0 12px;
  margin-right: 10px;
  color: #777;
  width: 150px;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 125px center;
}

#headCol01 input#inputSearchCol01:focus
{
  border-bottom: 1px solid #111;
}

#mainCol01 label
{
  cursor: pointer;
  display: block;
}


#mainCol01 input[type='checkbox']
{
  margin-right: 6px;
}

#footDetailListaFiltrow01
{
  padding: 4px 12px;
  font-size: 12px;
  text-align: right;
  text-transform: uppercase;
}

#footCol01
{
  padding: 4px 12px;
  font-size: 12px;
  text-align: center;
}

#fltApply, #colApply
{
  padding: 0 6px;
  cursor: pointer;
  color: var(--main-color);
  text-transform: uppercase;
}

#fltClear, #colClear, #colAll
{
  padding: 0 6px;
  cursor: pointer;
  text-transform: uppercase;
}

.padding010
{
  padding: 6px 16px;
}

h3.smaller01
{
  font-size: 1.2rem;
  font-weight: bold;
}

.disc01
{
  font-size: 0.75rem;
  color: #aaa;
  line-height: 1.2rem;
  margin-top: 8px;
}

.disc01 strong{
  color:#777;
  font-weight: bold;
}

.seTextInput01
{
  font-size: 0.9rem;
  color: #777;
  padding: 2px 4px;
}

.seTextInput02
{
  font-size: 0.9rem;
  color: #777;
  padding: 2px 4px;
  width: 80px;
}

div.dataTables_wrapper div.dataTables_processing {
  color: var(--main-color);
}

.form-row .form-check-inline{
  margin-right: 0;
}

#clsAbs01 {
  position: absolute;
  right: 0px;
  bottom: 6px;
}

.vinUpdateView
{
  padding: 0 60px;
}

table.txta01 td, table tbody tr td.top01, .top01
{
  vertical-align: top;
}

table.txta01 td textarea#inp_data, #inp_reason
{
  padding: 2px 6px; line-height: 1.68em !important;
  width: 400px;
}

.wid200px
{
  width: 200px;
}

.wid160px
{
  width: 160px;
}

.wid310px
{
  width: 310px;
}

.wid140px
{
  width: 140px;
}

.wid120px
{
  width: 120px;
}

.wid60px
{
  width: 60px !important;
}

.wid70px
{
  width: 70px !important;
}

.wid40px
{
  width: 40px !important;
}

.wid100px
{
  width: 100px !important;
}

.wid100pro
{
  width: 100%;
}

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

.wid400px
{
  width: 400px;
}

.display01
{
  display: inline-flex;
}

.display01 .selectize-input
{
  padding: 4px 8px;
}

.label140px
{
  width: 120px;
  padding: 0 10px;
  text-align: right;
  display: inline-block;
}

.divRow01 input[type=text], .row04 input[type=text]
{
  padding: 2px 4px;
  border: 1px solid var(--szar01);
}

.divRow01 input[type=text]:focus
{
  border: 1px solid var(--main-color);
  background-color: #fcfcfc;
}

.padding31px
{
  padding-top:31px;
}

.padding31px input
{
  padding: 4px 6px;
  border: 1px solid #c0c0c0;
  font-size: 14px;
}

.row04
{
  margin: 8px 0;
  padding: 6px 8px;
  background-color: #fbfbfb;
}

#predictionComm
{
  width: 70px;
  text-align: center;
}

.date01 {
  font-size: 0.9em;
  color: #aaa;
}

.card-stats01 .card-body
{
  text-align: center;
}



.czer02
{
  background-color: var(--czer01) !important;
  border-color: #da0909 !important;
}

.czer03
{
  color: var(--czer01) !important;
}

.czer04
{
  color: var(--czer02) !important;
}

.border01
{
  border-left: 2px solid #fff !important;
  border-right: 2px solid #fff !important;
}

table.fontSize01
{
  font-size: 14px;
}

table.fontSize01 thead tr th{
  font-size: 14px;
}

.height400
{
  min-height: 400px;
}

.warn03
{
  padding: 1px 8px;
  color: #fff;
  background-color: #da0909;
  cursor: pointer;
}

table#RaportHandlowcyTable01 thead th
{
  text-align: center;
  font-size: 14px;
  padding: 0px 8px;
}

table#RaportSprzedazyTable01
{
  min-height: 368px;
}

table#RaportSprzedazyTable01 thead th
{
  /*text-align: center;*/
  font-size: 14px;
  padding: 0px 8px;
}


label.contractCars01
{
  position: relative;
  display: inline-block;
  width: 100px;
  height: 36px;
  text-align: center;
}

label.contractCars01 input
{
  opacity: 0;
  width: 0;
  height: 0;
}

label.contractCars01 span.val01
{
  position: absolute;
  cursor: pointer;
  top: 12px;
  left: 0;
  right: 0;
  bottom: 0;
  border-bottom: 2px solid #c41818;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + span.val01 {
  border-bottom: 2px solid #108537;
}

span.sts05
{
  font-size: 9px;
  text-transform: uppercase;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
}

span.sts06
{
  font-size: 9px;
  text-transform: uppercase;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  display: none;
}

span.val02
{
  display: inline-block;
  padding: 4px 8px;
  font-size: 1.1em;
  cursor: pointer;
  color: var(--main-color);
}

select.padding04
{
  padding: 0 4px;
}

.sts101
{
  border-left: 4px solid green !important;
}

.sts102
{
  border-left: 4px solid red !important;
}

.sts103
{
  border-left: 4px solid grey !important;
}

p.category01
{
  margin-bottom: 0px;
}

.hover01:hover
{
  box-shadow: 0 1px 4px 0 rgba(4, 16, 54, 0.5);
}

.inlineInp01 {
  padding: 2px 6px;
  line-height: 1.2em;
}

.divCheba {
  position: absolute;
  bottom: 170px;
  right: 10px;

}

.refresh01
{
  padding: 1px 4px;
  background-color: white;
  color: var(--main-color);
  border: 1px solid var(--main-color);
  cursor: pointer;
  transition: all 0.4s ease-in-out;
}

.refresh01:hover
{
  transform: rotate(360deg) scale(1.2);
}

.taLeft01
{
  text-align: left;
}

.taCenter01
{
  text-align: center;
}

.textArea01
{
  padding: 4px 6px;
  width: calc(100% - 12px);
}

.textArea02
{
  padding: 4px 6px;
  width: calc(100% - 12px);
  height: calc(100% - 12px) !important;
}

.inlineBox01
{
  display: inline-block;
  width:320px;
  vertical-align: top;
}

[data-notify="title"]
{
  font-weight: bold;
  font-size: 0.80em;
}

.foot41
{
  width:calc(62%);
  padding: 4px 0px 4px 12px;
  font-size: 14px;
  display: inline-block;
}

div.foot41 span
{
  display: inline-block;
  padding: 0 6px;
}

div.foot41.left01 {
  width: calc(37%);
}

.alert span[data-notify="message"]
{
  max-width:100%;
}

.desc04
{
  text-align: center;
  color: #888;
}

.font20
{
  font-size: 20px;
}

.font18
{
  font-size: 18px !important;
}

#remindTime
{
  background-color: #133574;
  color: #fff;
  border: none;
}

.alert-primary {
  margin-top: 0px !important;
}

.info01 {
  font-size: 0.9em;
  color: var(--szar01);
}

.text01 {
  font-size: 0.9em;
  color: var(--szar01);
  text-transform: uppercase;
  display:block;
}

.coll01 {
  display: flex;
  padding: 12px 0;
  background-color: aliceblue;
}

#btnAdd01, .btnAdd01 {
  /*padding: 6px 18px 12px 12px;
  background-color: aliceblue;*/
  text-align: right;
}

.foot01
{
  padding: 0 24px !important;
}

.btn-dodaj01
{
  float:right; 
  margin-top: 27px;
  padding: 4px 12px 2px;
}

.formSelect01
{
  padding: 1px 8px;
  max-width: 140px;
}

#RaportStrataTable02
{
  border-bottom: 1px solid #ddd;
  margin-bottom: -8px;
}

div.DTE_Field_Type_radio.DTE_Field_Name_clientStatus div.DTE_Field_InputControl > div > div {
  float: left;
  width: 33%; /* change as needed */
}

.divpros01
{
  margin: 0 auto;
  text-align: center;
  position: absolute;
  width: 100%;
  top: 0px;
}

.pros01 {
  cursor: pointer;
  font-size: 13px;
  color: #111;
}

.pros01::before {
    content: "";
    display: inline-block;
    width: 36px;
    height: 12px;
    margin-right: 5px;
}

.prosColor00::before {
  background-color: #4571c4;
}

.prosColor01::before {
  background-color: #153c84;
}
.prosColor02::before {
  background-color: #5b9bd4;
}
.prosColor03::before {
  background-color: #a6a6a6;
}
.prosColor04::before {
  background-color: #646464;
}
.prosColor05::before {
  background-color: #1974D2;
}
.prosColor06::before {
  background-color: #1357BE;
}
.prosColor07::before {
  background-color: #0D3AA9;
}
.prosColor08::before {
  background-color: #061D95;
}
.prosColor09::before {
  background-color: #000080;
}

.high01 td
{
  background-color: #fff9e8;
}

.back10 {
  background-color: #f9f9f9;
}

.back11 {
  background-color: #f5f5f5;
}

.active21 {
  position: absolute;
  top: 16px;
  right: 24px;
}

.active21 span {
  display: inline-block;
  text-transform: uppercase;
  font-size: 0.7em;
  padding: 4px 8px;
  border-radius: 4px;
  line-height: 1em;
}

.active21 span:hover {
  text-decoration: none;
}

.active21 span.activeOn {
  border: 1px solid #4caf50;
  color: #4caf50;
}

.active21 span.activeOff {
  border: 1px solid red;
  color: red;
  cursor: pointer;
}

.card .card-foot {
  padding: 0.9375rem 20px;
  display: flex;
  justify-content: space-between;
  margin-top: -36px;
}

.card .card-foot div {
  align-self: center;
}

.card-header.noActive01 {
  pointer-events: none;
}

.mbot12px {
  margin-bottom: 12px;
}

#errorMsg {
  opacity: 0;
  transition: 0.3s;
}