@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap');
body { font-family: 'Roboto Condensed', sans-serif; font-weight: 400; } 
#scroll-progress {
  position: fixed;
  top: 0;
  width: 0%;
  height: 4px;
  background: #7983ff;
  z-index: 10000;
}
/*app-header*/
:root {
  --glowny-kolor-tla: brown;
}
.inter {
	 font-family: 'Inter', Arial;
}
.roco { 
  font-family: 'Roboto Condensed', Arial;
}
@media (min-width: 768px) {
    body.app-aside-hover .app-aside {
        
       /* top: 0px !important;*/
    }
}
.hide {
	 display: none;
}
.rel { position: relative }
.flex,.f { 	display: flex; }
.fs-30 {	 font-size:30px;}
.fs-24 {	 font-size:24px;}
.fs-22 {	 font-size:22px;}
.fs-20 {	 font-size:20px;}
.fs-18 {	 font-size:18px;}
.fs-16 {	 font-size:16px;}
.fs-14 {	 font-size:14px;}
.fs-12 {	 font-size:12px;}
.fs-12i {	 font-size:12px !important;}
.fs-11 {	 font-size:11px;}
.fs-11i {	 font-size:11px !important;}
.fs-10 {	 font-size:10px !important;}
.t50 {
	opacity: 0.5;
}

.m-t-25 {
	margin-top: 25px;
}
.b-0 {
	border: 0px !important;
}
/*.shd {
	 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075); }
}*/
.center {
	text-align: center;
}
h3 strong {
	font-weight: 900;
}
.blacky {
	color: #111 !important;
}
.whitey {
	color: #fff !important;
}
.fff { color: #fff; }
.blacky2 {
	color: #555 !important;
}
.col333 {
	 color: #333;
}
.col666 {
	 color: #666;
}
.tooltip {
	font-size: 11px; font-weight: 500;
}
.p3 { padding: 3px; }
.lh-32 { line-height: 32px; }
.lh-22 { line-height: 22px; }
.lh-20 { line-height: 20px; }
.lh-25 { line-height: 25px; }
.lh-18 { line-height: 18px; }
.lh-16 { line-height: 16px; }
.lh-14 { line-height: 14px; }
.lh-12 { line-height: 12px; }
.lh-10 { line-height: 10px; }

.app-header .navbar-nav > li.wcb > a { font-weight: 800 !important; color: #fff !important; }
.app-header .navbar-nav > li.wcb > a:hover { background-color: #404040; }
.app-header .navbar-nav > li.wcb > a:hover i { opacity: 0.8 }

body.app-layout-application .app-wrapper .app-content {
  top: 60px;
}

.ls-1 {
	letter-spacing: -1px;
}
.fw1 { 	font-weight: 100; }
.fw2 { 	font-weight: 200; }
.fw3 { 	font-weight: 300 !important; }
.fw4 { 	font-weight: 400; }
.fw6 { 	font-weight: 600; }
.fw7 { 	font-weight: 600; }
.fw8 { 	font-weight: 800; }
.fw9 { 	font-weight: 800; }

.f-w\:700 { font-weight: 700; } /* f-w:700 */

a[name]:not([href]){
  display: block;    
  position: relative;     
  top: 54px;
  visibility: hidden;
}


#mesat .nav-item .nav-link.active { 
  background-color: #ddd !important;
  font-weight: 600;
}

.up {
	text-transform: uppercase;
}
.bold {
	font-weight:bold;
}

.st .fa.n { text-shadow: 0 0 4px #FFF; }

.btn-bw {
  background: rgba(255, 255, 255, 0.2);
	color: #eee;
	/*border: 1px solid #aaa;*/
	border-radius: 3px;
}
.btn-bw.btn-xs {
	padding: 2px 8px;
}
.btn-bw:hover {
	background: rgba(255, 255, 255, 0.3)
}
.btn-bw2 {
	background-color: transparent;
	color: #eee;
	border: 2px solid #666;
	border-radius: 4px;
}
.btn-bw2.btn-xs {
	padding: 2px 12px;
}
.btn-bw2:hover {
	background: rgba(255, 255, 255, 0.3)
}

.btn-yl {
	color: #6C3333;
	background-color: #FEC43E;
}

.shim {
  position: absolute;
  left: -75px;
  top: -40px;
  width: 100px;
  height: 100px;
  border: 0 solid #d92e14;
  background: rgba(255,255,255,0.15);
  -ms-transform: rotate(25deg);
  -webkit-transform: rotate(25deg);
  transform: rotate(25deg);
  outline: 0 !important;
}
.oicolors { font-size: 13px; color: #444; }
.oicolors small { font-size: 12px; }
.oicolors strong { font-weight: 600; }

a.btn-t {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: #fff;
    border-radius: 5px;
    padding: .5rem 1.2rem;
    transition: all .3s ease-in-out;	
}
a:hover.btn-t {
	border: 1px solid rgba(255, 255, 255, 1);	
	background: rgba(255, 255, 255, 0.3);
}

.row-gap-0.row, .row-gutter-0.row {
  margin: 0 0rem; }
  .row-gap-0.row > div[class^="col-"], .row-gutter-0.row > div[class^="col-"] {
    padding-left: 0rem;
    padding-right: 0rem; }

.panel.panel-transparent {
	background-color: transparent;
	border: 0px;
}    
    
.panel .panel-body {
	padding: 0px;
}
.panel .panel-body.hd a {
	font-size: 16px; color: #111;
	font-weight: 700;
}
.panel .panel-body.hd p {
	font-weight: 300; line-height: 18px;
}
.panel .panel-body.hd p:last-child {
	padding-bottom: 0px;
}
.btn-b2 {
	background-color: transparent;
	border: 2px solid #fff;
	color: #fff;
}
.btn-bk {
	background-color: transparent;
	border: 2px solid #333;
	color: #333;
}
.btn-bk:hover {
	background-color: #333;
	border: 2px solid #333;
	color: #eee;
}
.bth {
	
  &:hover {
    opacity: .9;
  }
}
.btc {
border-radius: 4px;
	vertical-align: middle;
	    transition-duration: .28s;
    transition-property: box-shadow,transform,opacity;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
}

.label-light {
	 background-color: #d0d0d0;
}

.l-pro {
padding: 4px 8px;
background: rgb(0,0,0);
background: linear-gradient(217deg, rgba(40,40,40,1) 31%, rgba(255,217,0,0.4) 79%, rgba(255,217,0,0.8) 100%);
text-shadow: 1px 2px 2px #000000;

}
.l-pro.big { padding: 8px 12px;}

.nav-item .label-pro {
	font-size: 11px !important; color: #eee; font-weight: 700; background-color: #333;
}

.bl1 {
	border-left: 1px solid #eee;
}

.c0 {
	 color: #000;
}
.panel-heading .h5 {
	margin-bottom: 0px; 
}
/* aside brand */
.sbrands a { color: #ccc;  }
.sbrands a:hover span { color: #666 !important; }
.sbrands a b { color: #333;  }
.sbrands a u { text-decoration: none; font-size: 0.8em;  }
.sbrands a u.label { background-color: #bbb; padding: 2px 4px 2px; float: right; margin-right: 10px; margin-top:1px }
.sbrands a:hover b { color: #111; }
.sbrands .active a {
	background-color: #ddd;
}

.m-models > li > a > div > span { font-size: 14px; color: #333; }
.m-models > li.active > a { color: #111;  background-color: #ccc }


.app-aside-folded #panel1add { display: none; }
.app-aside-hover #panel1add { display: none; }

/*modyfikacje*/
body.themeWhite .main-nav { background-color: #E7E7E7 }
body.themeWhite .main-nav li > a i { background-color: transparent !important;  }

body.themeWhite .nav.main-nav.sbrands li > a i { transform: scale (0.8) !important;  }

body.themeWhite .app-header .navbar-brand { border: 0px; background-color: #fff; }

/**header**/

.app-header { line-height: 2.4; background-color: #fff  }


/* redB */
.app-header.redB {
	background-color:	#C30006;
}
.app-header.redB .nav.navbar-nav > li.nav-item > a {
	color: #fff !important; 
}
.app-header.redB .nav.navbar-nav > li.nav-item > a:hover {
	/*background-color: #9C0005;*/
  background-color: rgb(0 0 0 / 10%)
}
.app-header.redB .nav > li.nav-item a .text-muted { opacity: 0.9 }
.app-header.redB .navbar-brand { }



.section-header { background-color: #eee; padding: 10px; color: #444; }

.hleader {
	text-transform: uppercase; color: #999; padding-bottom: 10px; margin-top: 10px;
	font-size: 1.1em;
}

/* 1st */
#onecounts {
	background: #898989 url(/img/parking1.gif) no-repeat bottom right;
}
.gc {
  box-sizing: border-box;
  margin: 0;
  padding: 0;   
  display: grid;
  grid-template-columns: 2fr 6fr;
  grid-template-rows: 1fr 1fr;
  grid-template-areas: 
    "gblue gred"
    "gyellow gred";
  width: 100%;
  height: 300px;
  .gred, .gblue, .gyellow {
    heigth: 100%;
    width: 100%;
    font-size: 25px;
    text-align: center;
  }
}

.gred {
  grid-area: gred;
}

.gblue {
  grid-area: gblue;
}

.gyellow {
  grid-area: gyellow;
}


.h-100,.h100 {
	height: 100%;
}

.topnavdrop a {
	font-weight: 400;
}
.topnavdrop a.dropdown-item small {
	color: #999; display: block;
}

.navbar-nav .nav-item a {
	/*font-weight: 500; */font-size: 15px;  font-weight: 600; color: #555 !important;
}
.nav-line.nav-1 > li > a {
	 color: #444; white-space: nowrap
}
.nav-line.nav-1 > li > a.active,.nav-line.nav-1 > li > a:hover,.nav-line.nav-1 > li > a:focus {
	 color: #111;
}
.nav-line.nav-1 > li > a small {
	color: #888
}

.navbar-nav.navbar-right .nav-item a.with-text { font-weight: 400; font-size: 12px; line-height: 36px; }

.dropdown-div {
	color: #888; font-size: 11px; font-weight: 400; text-transform: uppercase; padding: 0px 8px;
}

.ulab { 
  line-height: 15px; font-size: 11px; padding-left: 4px !important;
}
  .ulab.lab-ok { border-color: green; border-left:6px solid green}
  .ulab.lab-rysa { border-color:yellowgreen; border-left:6px solid yellowgreen }
  .ulab.lab-odprysk { border-color: rgb(255, 217, 0); border-left:6px solid rgb(255, 217, 0) }
  .ulab.lab-przetarcie { border-color: orange; border-left:6px solid orange }
  .ulab.lab-pekniecie { border-color: orange; border-left:6px solid orange }
  .ulab.lab-wgniecenie { border-color: orangered;border-left:6px solid orangered }
  .ulab.lab-korozja { border-color: blueviolet;border-left:6px solid blueviolet }
  .ulab.lab-malowane { border-color: rgb(25, 99, 148); border-left:6px solid rgb(25, 99, 148) }
  .ulab.lab-wymienione { border-color: blue; border-left:6px solid blue }
  .ulab.lab-naprawiono { border-color: #84ADC4;border-left:6px solid #84ADC4 }

.table.table-uszko { border-top: 0px; }
.table.table-uszko th { background-color: #fff; font-size: 12px; border-top: 0px; color: #ccc}

.dfsteps {
	 display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-items: center;
	align-content: stretch;
}

.bpad {
position: absolute; z-index: 9;	
}
 
#w-one {
	 border-top: 30px solid #000;
}
#w-one .he {
	font-size: 38px;
}
#w-one .tis1 { position: absolute !important; z-index: 9; 	 }
#w-one .tis1 a { background-color: rgba(0,0,0,.3); color: #fff; font-size: 12px; border: 0px;
  padding: 6px 8px;   text-transform: uppercase; font-weight: 500;  }
  #w-one .tis1 a:hover { text-decoration: none; background-color: rgba(0,0,0,.5); }  

.popover-title { background-color: #fff; border-bottom: 0px; color: #111; text-transform: uppercase; font-size: 14px;}

.labx {
	 background-color: #333;
}

/* 1st.one */
#oneP {
	min-height: 255px;
}
#oneP .fl1 {
	font-size: 22px; 
}
#oneP .fl1 a {
	 color: #222;
}
#btnNadwozie {    
    bottom: 20%;
    left: 36%; 
}
#btnSilnik {
    top: 270px;
    left: 125px;
}
#btnDokumentacja {
    top: 50%;
    right: 20%;
}
#btnWnetrze {
    top: 55%;
    left: 50%;
}
#btnMechaniczne {
    bottom: 10%;
    left: 20%;
}
#btnWyposazenie {
      top: 70%;
      right: 35%; 
}    
#w-pro {
  background: #686868 url(/img/pro5.jpg) no-repeat top right;
  background-size: 300px;

}    
    #w-one { 
        /*background-color: #494249;  */      
        position: relative;
        /*background-image: url(/img/ad1000hala.jpg);*/
        background-position: 0% 0%;
        background-repeat: no-repeat;
        background-size: cover; /*         background-size: 100%; /* rest for resolutions */

        background-image:
        linear-gradient(to top, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0.9) ),
        url('/img/ad1000hala.jpg');
    }    
    #w-one:before {
       /* background-image: url(/img/ad1000hala.jpg);
        background-position: 0% 0%;
        background-repeat: no-repeat;
        background-size: cover;
        content: " ";
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        position: absolute;
        z-index:0;*/
    }
    .wbody {
    	height: 440px; /* 410*/ /*200+200 10*/
    }
    /*#wbody:before {
        background: linear-gradient(180deg,#000,transparent);
        background-repeat: repeat-x;
        content: " ";
        left: 0;
        right: 0;
        height: 200px;
        top: 0;
        position: absolute;
   
    }
    */
    #firstPanel {
    	margin-top:-1px;
    	font-family: Inter, Arial;
    }
    	#firstPanel h3 {
    		font-weight:800;
    	}
    #wbody {
    	 font-family: Inter, Arial;
    }
    	#wbody h2 {
    		font-weight: 800;
    	}
    #wbody .headr {
    	background: linear-gradient(0deg,rgba(42,52,61,0) 20%,#000); 
    	height: 100%;
    	/*padding: 30px 40px;*/
    	/*text-shadow: 0 0 30px #2a343d;*/
    }
    .shadowban {
    	/*background: linear-gradient(0deg,rgba(42,52,61,0) 30%,#000); */
    	height: 100%;
      /*.shadow2ban*/
    }
    #w-one:before { 
      /*background: linear-gradient(0deg,rgba(42,52,61,0) 30%,#000); */

    }
    #wbody .headr h4 {
    	 color: #ccc; font-weight: 400; font-size: 21px;
    }
    
    #oneContent {
    	position: absolute; top: 30px; right: 0; width: 25%;
    }
    	#oneContent .list-group-item {
    		padding: 5px 10px;
    	}
    #oneContent2 {
    	position: absolute; bottom: 10px; right: 0; width: 28%;
    }
.shadow2ban .panel {
	 border: 0px;
}  
    
.zauto { margin: 0 auto; }
.ocar a { color: #222; text-align: center; }
.ocar a:hover { text-decoration:none; color: #000 }
.ocar .oimg {padding-top: 10px; }

#oneGarage .slick-dots { width: auto; bottom: 0; left: -20px; }

#tabCar a { font-weight: 700; font-size: 14px }
#tabCar a.active, #tabCar a.active i { color: #000 !important }
#tabCar a:hover, #tabCar a:hover i { color: #666; }

.panel-car .price { color: #F8C023; background-color: #173559; }
.panel-car .price h4 { font-weight: 800 }
.panel-car .price h4 small { font-weight: 600; }

#ogarage {
	background: #000 url(/img/g1rs.jpg) no-repeat right top; 
	border: 0px; padding: 10px 10px; 
  background-position: bottom right; margin: 15px; min-height: 250px
} 
#ogarage .label {
	font-size: 10px; color: #fff; border: 1px solid #fff; margin-left: 10px; font-weight: 600;
} 
#ogarage h3 {
	padding: 10px; font-size: 30px; line-height: 0.8em; font-weight: 800;
}
#ogarage .lead {
	font-size: 1.3em; font-weight: 400; color: #ccc;
}
#ogarage .og p {
	 font-weight: 400; font-size: 14px; color: #ccc; margin-bottom: 5px; line-height: 18px;
}  

.panel-trans { background-color: transparent;border:0px }

.sprzedajesz h3 { position: absolute; right: 0; }
.sprzedajesz ul { margin-top: 120px; }
  
/* 1st.widget */
.wc200 {
	height: 200px;
}
.wc160 {
	height: 160px;
}
.wc200 svg {
	 fill: #fff;
}
#w-count {
background-color: #575757;
}

#counters-one { background-color: #333; padding: 5px; }
#counters-one .btnn { text-transform: uppercase; font-weight:bold; background-color: #fff; }
#counters-one .wrapper {
	 padding-top: 0px !important; padding-bottom: 0px !important;
}
.counter-one { 
    font-size: 15px; text-transform: uppercase; 
     display: flex;
} 
.counter-zero strong { 
  margin-top: 5px;
  font-size: 18px;
  background-color: #666;
  margin-right: 8px;
  -webkit-box-shadow: 0px 0px 10px 5px rgba(143,143,143,0.81);
  -moz-box-shadow: 0px 0px 10px 5px rgba(143,143,143,0.81);
  box-shadow: 0px 0px 10px 5px rgba(143,143,143,0.81);
  float: left; 
  overflow: hidden;
}
.counter-one strong { 
  margin-top: 6px;
  font-size: 18px;
  background-color: #555;
  margin-right: 8px;
  -webkit-box-shadow: 0px 0px 10px 5px rgba(143,143,143,0.61);
  -moz-box-shadow: 0px 0px 10px 5px rgba(143,143,143,0.61);
  box-shadow: 0px 0px 10px 5px rgba(163,163,163,0.61);
 /* float: left; */
 display:flex;
  overflow: hidden;
}
.counter-one span { 
  color: #666;
  font-size: 20px;
  padding: 2px 4px;
  line-height: 24px;
  /*margin-right: 2px;*/ border-right: 2px solid #6A6A6A;
  background-color: #fff;
}
.counter-one small { 
   line-height: 8px;
   font-size: 11px;
}
.counter-one b {
  display: block;  line-height: 12px;
}

.ock { background-color: #000; color: #fff; text-align: center; font-family: Inter, Arial;  }
 .ock .ocena small { font-weight: 400; }
 .ock .ocena { font-size: 20px; font-weight: 600; border: 1px solid #000;  }
 .ock .soc { background-color: #fff; color: #333; text-align: center; font-size: 12px; border: 1px solid #000;  }

 
.backTitle {
    font-size: 120px;
    font-size: 6rem;
    line-height: 120%;
    color: #ddd;
    /*opacity: .05;*/
    /*margin: 0 0 -105px -5px;*/
    margin-bottom: -50px;
    text-align: right;
    font-family: Inter, Arial,sans-serif!important;
    /*text-shadow: 0 0 100px #0000001f;*/
    text-shadow: 0 0 50px #ffffffff;
    font-weight: 800;
}
.bt1 {
	padding-bottom: 60px;
}
 
/*li under yellow*/
.ul1 li::after {
	 content: '';
	 display: block;
	 width: 32px;
	 height: 32px;
	 background: rgba(255,234,0,0.35);
	 position: absolute;
	 top: 0rem;
	 left: 0.7rem;
	 border-radius: 50%;
	 z-index: 0;
}
.ul1 li strong {
	 position: relative;
	 z-index: 1;
	 display: inline-block;
}
.ul1 li strong:after {
	 content: "";
	 position: absolute;
	 width: 95%;
	 bottom: 2px;
	 left: 0;
	 right: 0;
	 height: 9px;
                                                    
	 background-color: rgba(17,196,183,0.2);
	 z-index: -1;
} 

/*li under yellow*/
.ul2 {
	background-color: transparent;
	font-size: 18px;
}
.ul2 li {
	color: #333; 
	border: 0px;
	font-weight: 600
}
.ul2 li strong {
	 position: relative;
	 z-index: 1;
	 display: inline-block;
}
.ul2 li strong:after {
	 content: "";
	 position: absolute;
	 width: 95%;
	 bottom: 2px;
	 left: 0;
	 right: 0;
	 height: 9px;                                                  
	 background: rgba(255,234,0,0.35);
	 z-index: -1;
} 
.ul2 .fa-stack-2x {
	opacity: 0.7
}
.ul2 p {
	margin-bottom: 0px; line-height: 14px;
	color: #888; font-size: 13px; font-weight: 400;
}

/* head do podkreslenia*/
.hul {
  position: relative;
  z-index: 1;
  display: inline-block;
}
.hul:after {
  content: "";
  position: absolute;
  width: 95%;
  bottom: 2px;
  left: 0;
  right: 0;
  height: 9px;                                                  
  background: rgba(255,234,0,0.35);
  z-index: -1;
} 

/*div .azen-icon <span class="ti-wordpress az-icon"><span></span></span>*/
.zen-icon { display: flex; }
.zen-icon > div { margin-left: 20px !important; }
.zen-icon span {
  font-size: 34px;
  color: #6278df;
}
.zen-icon .zicon { 
  position: relative; z-index: 0;
}
.zen-icon .zicon span {
  content: '';
  position: absolute;
  border-radius: 80%;
  left: 25%;
  top: 0;
  width: 1em;
  height: 1em;
  /*background-color: rgba(0, 0, 0, 0.1);*/
  background-color: rgba(255, 234, 0, 0.7);
  z-index: -1;
}
.zen-icon .zicon.b span { /*blue*/
  /*background-color: rgba(0, 140, 192, 0.5);*/
  background-color: rgba(0, 157, 255, 0.3);
}




/* y one */
 .li-normal { border: 0px; padding-right: 20px; padding-left: 10px; color: #333; background-color: transparent; }
.li-normal li { display: flex; font-weight:400; border: 0px; }
.li-normal div { line-height: 18px; font-size: 12px; font-weight:400; }
.li-normal span { margin-right: 10px; font-weight: 800; padding-top: 14px; opacity: 0.7 }
.li-normal strong { display: block; font-size: 18px; font-weight: 800 }

/**
#Top
**/
.navbar-brand .normal-logo {
	padding: 5px 0px 0px 16px; 
	line-height: 40px; height: 44px;
}
 #wno2 {
	 font-weight: 700;
	 font-size: 11px;
	 line-height: 11px;
	 color: #bbb;
	 position: absolute;
	 top: 20px;
	 left: 128px;
	 text-transform: uppercase;
}
#wno2 b {
	 display: block;
	 color: #888;
}
.app-aside-folded #wno2 { display: none;  }
 
#wno2.red { 
 color: #fff; opacity: 0.6
}
	#wno2.red b {
		color: #fff;opacity: 0.8
	}
body.themeBrown .app-header .navbar-brand, body.themeBrown .app-header {
	background-color: #C30006; border: 0px;
}
body.themeBlack .app-header .navbar-brand, body.themeBrown .app-header {
	background-color: #282828; border: 0px;
}
body.themeBlack .app-header {
	background-color: #282828; 	
}
body.themeBlack .app-aside {
	background-color: #d0d0d0; 
}

body.theme666 .app-header .navbar-brand,body.theme666 .app-header {
	background-color: #666; border: 0px;
}
body .app-aside {
	background-color: #E7E7E7; 
}
body.theme666 .app-aside {
	background-color: #E7E7E7; 
}

.app-header .navbar-header > .navbar-brand:after {
	height: 0px;
}

/**
#Lista
**/
.new3 .toeng {
	 line-height: 15px;
}
.toeng b {
	font-weight: 600;
}

.new .colcar {
	color: #333;
}
#listCars {
  
}
.clx {
	height: 220px; overflow: hidden;
}
#clx .carousel-indicators {
	width: 98%; left: 0%; right: 0%; top: 0;
	display: flex; justify-content: center;
	margin: 1%; opacity: 0.4;
	z-index: 102; 
}
#clx .carousel-indicators:hover {
	opacity: 0.8;
}
#clx .carousel-indicators li {
	border-radius: 0px;
	width: 25%; height: 5px;
	box-sizing: content-box;
	flex: 0 1 auto; border: 0px;
	background-color: #ccc; 
}
#clx .carousel-indicators.present2 li {	width: 50%; }
#clx .carousel-indicators.present3 li {	width: 33%; 	}
#clx .carousel-indicators.present5 li {	width: 20%; 	}

#clx .carousel-indicators li:hover {
	background-color: #fff; 	
}

#clx .carousel-indicators li.active {
	background-color: #fff;	height: 7px;
}
/*
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

https://cssgrid-generator.netlify.app/
*/

.fx1 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  height: 194px;
 
  }
  
  .fx1 > div {
    overflow: hidden;
  } 
  .fred { grid-area: 1 / 1 / 5 / 3; }
  .fgreen { grid-area: 1 / 3 / 3 / 4; }
  .fblue { grid-area: 3 / 3 / 5 / 4; }

  .fred, .fgreen, .fblue { height: 100%; width: 100%; }
  .fred { background-color: #fff; }
  .fgreen { background-color: #fff; }
  .fblue { background-color: #fff; }

/*
.fx123 {
  display: grid;
  grid-template-columns: 2fr 2fr;
  grid-template-rows: 1fr 1fr; 
  grid-template-areas: 
  "fred fgreen"
  "fred fblue";
  height: 175px;
}
.fred, .fgreen, .fblue { }
.fred {  grid-area: fred; }
.fgreen {  grid-area: fgreen; }
.fblue {  grid-area: fblue; }
*/
.gkon {
  display: grid;
  grid-template-columns: 3fr 6fr 2fr;
  grid-template-rows: 1fr 5fr 1fr; /* wysokosci */
    /*
      grid-template-columns: 2fr 2fr 2fr;
  grid-template-rows: 4fr 4fr; 
    */
  grid-template-areas: 
    "red blue green"
    "red blue green"
    "red pink brown"
    "red yellow yellow";
  height: 220px;
}
  .cI, .cAbout, .cMore, .green, .brown, .pink {
    height: 100%;
    width: 100%;
  }
	.cI {
  	/*background-color: #333;*/
  	grid-area: red;
	}
	.pink {
  	background-color: #fff;
  	grid-area: pink;
	}
	.cAbout {
  	background-color: #fff;
  	grid-area: blue;
	}

	.cMore {
  	background-color: #e9e9e9;
  	grid-area: yellow;
	}

	.green {
  	background-color: #fff;
  	grid-area: green;
  	/*border-left: 1px solid #eee;*/
  	text-align: center;
	}
	.brown {
background-color: #fff;
  	grid-area: brown;
  }
  
/* 
list.o2 
*/
.pricelocation {
  /*background-color: #ECEEEF; */
  display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-items: center;
	align-content: space-between;
  border-left: 1px solid #eee;
  margin: 3px 0px;
}

.gkon2 {
  display: grid;
  grid-template-columns: 4.5fr 6fr 2fr;
  grid-template-rows: 4fr 5fr 2fr; /* wysokosci */
  grid-template-areas: 
    "red blue green"
    "red blue green"
    "red pink brown";
  height: 194px;
}    

.fc {
	padding-top: 5px;
}

@media (max-width: 1340px) { /* lg 1200 */
  .gkon2 {
    display: grid;
    grid-template-columns: 5fr 6fr 2fr;
    grid-template-rows: 3fr 4fr 1fr 1fr; /* wysokosci */
    grid-template-areas: 
      "red blue blue"
      "red blue blue"
      "red pink pink"
      "red green brown";
    height: 194px;
  }  
  .pricelocation {
    background-color: #ECEEEF; display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: flex-end;
    align-content: flex-end;
  }  
  #listing .ctit a small {
    display:inline !important; 
  }
  #listing .ctit a sup { top: -0.3em; }
  #listing .stan { display: flex; }
}

@media (max-width: 1100px) {
  #colFilter {
    width: 200px;
  }
  .gkon2 {
    display: grid;
    grid-template-columns: 5fr 6fr 2fr;
    grid-template-rows: 3fr 4fr 1fr 1fr; 
    grid-template-areas: 
      "red blue blue"
      "red blue blue"
      "red pink pink"
      "red green brown";
    height: 194px;
  } 

  .fx1 {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas: 
      "fred fred"
      "fgreen fblue";
    }    
    .fx1 > div {      overflow: hidden;
    } 
  
}

.ww {
	font-weight: 900; color: #555; letter-spacing: -1px;
}
.c33 {	 color: #333;}
.c66 {	 color: #666;}

.bgr {
	background-color: #fff;
	
}
.bgr .slick-slide {
	border-right: 2px solid #fff;
}

.ish { position: relative; }
.ish img {  
  width: auto;
}
.ish::before {
    content: "";
    position: absolute;
    z-index: 101;
    top: 0px;
    left: 0;
    width: 100%;
    height: 20%;
    background-image: linear-gradient(rgba(34,34,34,.2),transparent);
}
.ish::after {
  content: "";
  position: absolute;
  z-index: 103;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 33%;
  background-image: linear-gradient(transparent, rgba(34,34,34,.9));
}

.optw .label { 
  font-weight: 400;
  font-size: 0.8em;
  margin-bottom: 4px;
  margin-left: 5px;
  color: #333;
  background-color: white; border: 1px solid #ccc; 

}

.sgear { font-size: 12px; line-height: 11px; }
.sgear .label { background-color: #ccc; color: #666; margin-right: 4px; margin-top: -1px;  }
.sgear small { font-size: 10px; display: block }
.sgear b { font-weight: 600; line-height: 13px;  }
.sgear .fr4 .label { background-color: #aaa; color: #eee; font-weight: 800; padding: 5px; font-size: 11px; }
.sgear .ge4 .label {  background-color: #cacaca; padding: 8px 5px; color: #777; border-radius: 32px; font-weight: 800; font-size: 11px;  }
/* lista.img */	
.cit::before {
    content: "";
    position: absolute;
    z-index: 101;
    top: 0px;
    left: 0;
    width: 100%;
    height: 20%;
    background-image: linear-gradient(rgba(34,34,34,.2),transparent);
}
.cit::after {
    content: "";
    position: absolute;
    z-index: 103;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 33%;
    background-image: linear-gradient(transparent, rgba(34,34,34,.9));
}

.cit .carousel-inner > .carousel-item > img {
	max-width: inherit;
	    height: 100%;	
}

.fotohd {
    position: absolute;
    right: 5px;
    bottom: 5px;
    /*display: inline;*/
    padding: 2px 5px;
    color: #eee;
    z-index: 104; font-size: 10px; text-transform: uppercase; vertical-align: middle;
}
.fotohd.left { left: 2%; bottom: 2%; }

.fotohd img {
vertical-align: middle;
opacity: 0.8
}
.fotohd span {
	line-height: 16px;
}
.fotohd .empty {
	opacity: 0.3
}
  
#colFilter {
	
}
	#colFilter .item-content {
		
	}
  
.img-cover-brand-list {
    background-position: 50% 50%;
    background-size: cover;
    position: relative;
    opacity: 0.5
} 
.img-covered {
  background-color: #000
}



#listing {
	background-color: #eee;
}
#listing .list {
	background-color: #eee;
}
#listing .list .item-content {
  border-left: 0px solid #F5F5F5;
  margin-left: 8px;
	padding: 0px; margin-top: 10px;
}
#listing .list .item-content.view {
	/*border-left: 8px solid #111;*/
}
#listing .list .item-content {
  /*-webkit-box-shadow: 4px 0px 4px 0px rgba(99,99,99,0.2);
  -moz-box-shadow: 4px 0px 4px 0px rgba(99,99,99,0.2);*/
  box-shadow: 2px 0px 4px 0px rgba(68,68,68,0.2);
  }
#listing .list .item-content:hover {
-webkit-box-shadow: 8px 0px 8px 0px rgba(68,68,68,0.2);
-moz-box-shadow: 8px 0px 8px 0px rgba(68,68,68,0.2);
box-shadow: 8px 0px 8px 0px rgba(68,68,68,0.2);
}
#listing .item-content sup {
	font-weight: 300;
}
#listing .ctit {
	padding: 5px 10px 0px; margin-bottom: 0px;
}
#listing .ctit a {
	color: #000;
}
#listing .ctit a small {
	display:block; font-size: 13px;
}
#listing .ctit sup {
	font-weight: 500;
}
#listing a {
	display: inline;
}
#listing .btn-show { display: block; margin-top: 4px;  }

.pobs {
	position: absolute; bottom: 5px; left: 5px; z-index: 105;
}
.new3 .pobs {
	position: static; float: right; padding-top: 4px; padding-right: 5px
}
.pobs.top { top: 5px;  }
.pobs a {
	float: left;
	opacity: 0.7;
}
.pobs a:hover {
	float: left;
	opacity: 1;
}
.cI .pobs i {
	color: #fff;
}

.pobs3 {
	position: absolute; top: 5px; right: 5px; z-index: 105;
}
.pobs3.top { top: 5px;  }
.pobs3 a {
	float: left; color: #28477C;
	opacity: 0.7;
}
.pobs3 a:hover {
	float: left;
	opacity: 1;
	text-decoration: none;
}

.pobs4 {
	
}
.pobs4.top { top: 5px;  }
.pobs4 a {
	float: left; color: #28477C;
	opacity: 0.7;
}
.pobs4 a:hover {
	float: left;
	opacity: 1;
	text-decoration: none;
}

.roads {
	color: #444;
}
.roads b {
	font-weight: 900;
}
.obst {
	position: relative;
	background-color: #84ADC4;
	padding: 2px 4px; line-height: 12px;
	margin-left: 3px; margin-top: 6px;
}
.obny {
	 font-weight: 100; line-height: 10px; font-size: 9px; margin-left: 8px; padding-top: 5px;
}
.obst b {
	color: #fff; font-size: 12px;
}
.obst:before {
	content: "";
	position: absolute;
	top: 5px;left:-4px;
	width: 0; height: 0;
	border-top: 4px solid transparent;
	border-right: 4px solid #84ADC4;
	border-bottom: 4px solid transparent;
    
}
.obstL {
	position: relative;
	background-color: #84ADC4;
	padding: 2px 4px; line-height: 12px;
	margin-left: 3px; margin-top: 6px;
}
.obstL b {
	color: #fff; font-size: 12px;
}
.obstL:before {
	content: "";
	position: absolute;
	top: 5px;right:-4px;
	width: 0; height: 0;
	border-top: 4px solid transparent;
	border-left: 4px solid #84ADC4;
	border-bottom: 4px solid transparent;
    
}
.cmini {
	color: #999; font-size: 10px; text-transform: uppercase; line-height: 8px; }
/* Lista pozycja */
#listing .toeng {
	color: #444;
}
.blok.engine { width: 27px; height: 40px; position: relative; margin-right: 14px; }
.engine { background-image: url('/static/ico/engines.png'); background-size: 100px; float: left; margin-right: 8px;  }
/*.engine.r { display: inline-block; width: 27px; height: 40px; background-position: 0px 0px; }*/
.engine.v { display: inline-block; width: 32px; height: 40px; background-position: -25px 0px; }
.engine.w { display: inline-block; width: 40px; height: 40px; background-position: -60px 80px; }
.cyl { position: absolute; top: 5px; right: -10px; display: inline; padding: 2px 4px; background-color: #ddd; font-size: 12px; font-weight: bold; text-align: center; color: #666; }

.list-oferta-dane { padding-top: 6px; padding-left: 15px; }
.colcar b { color: #666;  }

.listprice { font-weight: 900; color: #2b5070; margin: 0px 10px; word-spacing: -2px; letter-spacing:-1px }
.listprice sub { font-weight: 500; font-size: 12px; bottom: 0; }

#listing .sm {
line-height: 8px; font-size: 10px; }

.loco { color: #666; line-height: 14px; }
  .loco a { font-size: 10px; }

.fc {
	line-height: 16px; color: #444;
}
.fc .lb {
	line-height: 19px; color: #98989A;
}
.d-flex {
	display: flex!important;
}
.flex-fill {
	flex: 1 1 auto!important;
}
.pl {
	padding-left: 10px;
}
.eq .h4 {
	color: #444
}
.eq .label {
	font-weight: 400; font-size: 0.8em; margin-bottom: 4px; margin-left: 5px;
	color: #555; border-color: #ccc;
}
.vcar {
    color: #666;
    width: 64px;
    display: block;
    opacity: 0.3;
    margin-top: 5px;
}
.mvcar {
    color: #666;
    width: 48px;
    display: block;
    opacity: 0.3;
}

.emptybox { 
  border: 1px dashed rgba(38, 42, 46, 0.4);
  color: #214B61;
  text-decoration: none;
}
a:hover.emptybox { text-decoration: none; }
.emptybox i { opacity: 0.6 }

/** Forms **/
.gform label {
	color: #777;
}
.gform .form-control-line {
	font-size: 18px; 
	padding: 6px;
} 
.bbig {
	 font-size: 20px;
}


/**
Garaz
**/
.btm {
	text-transform: uppercase; font-size: 16px; font-weight: bold;
}
.p-subtitle {
	font-size: 13px; font-weight: 300; padding: 0px 10px; margin:0;
}

.ginfos {
	padding: 20px; margin: 20px; margin-left: 0px;
	color: #fff; background-color: #333;
	font-size: 18px; line-height: 24px;
	font-weight: 300;
}
.ginfos strong {
	 display: block; margin-bottom: 8px; font-size: 20px; 
}

#tg {
	/*line-height: 55px; */
}
#tg .top-garage { padding: 12px 5px 0px 5px; line-height: 13px;  }
#tg .top-garage span { display: block; }

#tg a {
	color: #333; /*padding: 11px;*/
}
#tg .dfi { line-height: 46px; padding-top: 8px; }
#tg .avatar.avatar .text-muted { color: #111; }
#tg a:hover {
	text-decoration: none;
}
#tg .itemno {
	 padding-left: 5px; padding-right: 10px;
}
#tg .dropdown-div { font-size: 10px; }
#tg .itemno a {
  font-weight: 400; font-size: 11px; color: darkblue
}
#tg .itemno a .label {
  margin-top: 3px
}
/*.navbar-nav .navitem #tg .dropdown-item { font-size:12px }*/


.ullist li {
	background-color: transparent !important;
	border: 0px;
}
#listing .showbtn { 
  background-color: #214B61; color: #fff; margin-top: 2px; margin-right: 2px; display: block; 
}
  #listing a:hover.showbtn { background-color: #000;  }

#listing .showbtn2 { 
  border: 2px solid #446e85; color: #214B61; margin-top: 2px; margin-right: 2px; display: block;
}

/**
#oferta
**/
#topf {
  display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start; /*space-around;*/
	align-items: stretch;
	align-content: stretch;
  padding: 8px;
}
  

.df { display: flex; }
.dfi { display: flex !important; }
#pricefotoblock {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
}
.app-aside-show #pricefotoblock {
  display: flex;
  flex-direction: column;
}
#priceblock { background-color: #222; color: #fff; padding: 5px; 
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    align-content: stretch;
  }

  /* zwinieta Cena */
  .app-aside-folded #priceblock { width: 50%;  text-align: center; padding: 10px; 
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    align-content: space-around;
  }
    

/* photos */
#gf {
	background-color: #393939; border-bottom: 4px solid #393939; border-right: 4px solid #393939;
}
  .app-aside-folded #gf { border-right: 0px; }

.gfoto {
	background-color: #393939;
	display: grid;
	grid-template-columns: 2fr 2fr;
	grid-template-rows: 6fr 4fr 4fr; /* wysokosci */
	grid-template-areas: 
		"f1 f1"
		"f2 f2"
		"f3 f4";
}

.gfoto3 {
	background-color: #393939;
	display: grid;
	grid-template-columns: 2fr 2fr;
	grid-template-rows: 6fr 4fr 4fr; 
	grid-template-areas: 
		"f1 f1"
		"f2 f2"
		"f3 f4";
}

.gdiv > div {
	height: 100%;  width: 100%; 
	border-top: 4px solid #393939; border-left: 4px solid #393939; border-right: 4px solid #393939; 
	overflow: hidden; position: relative;
}
 
@media (min-width: 768px) {
	.gfoto {
		background-color: #393939;
  	display: grid;
  	grid-template-columns: 5fr 2fr 2fr;
  	grid-template-rows: 5fr 4fr; /* wysokosci */
    	/*
      	grid-template-columns: 2fr 2fr 2fr;
  	grid-template-rows: 4fr 4fr; 
    	*/
  	grid-template-areas: 
    	"f1 f2 f2"
    	"f1 f3 f4";
  }
	.gfoto3 {
		background-color: #393939;
  	display: grid;
  	grid-template-columns: 7fr 2fr 2fr;
  	grid-template-rows: 1fr 1fr 1fr;
  	grid-template-areas: 
    	"f1 f3 f4"
      "f1 f2 f2"
      "f1 f5 f6";
  	height: 500px;
  } 
  /* 
  .app-aside-show .gfoto3 {
		background-color: #222;
  	display: grid;
  	grid-template-columns: 7fr 2fr 2fr;
  	grid-template-rows: 4fr 4fr 4fr; 
  	grid-template-areas: 
    	"f1 f3 f4"
      "f1 f2 f2"
      "f1 f5 f6";
  	height: 500px;
  } */ 

	.gdiv > div {
		height: 100%;  width: 100%; 
		border-top: 4px solid #393939; border-left: 4px solid #393939; border-right: 0px;
		overflow: hidden;
		position: relative;
	}
}

.fo:before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 0;
  width: 100%;
  height: 50px;
  background-image: linear-gradient(rgba(34,34,34,.6),transparent);
}
.fo1 {
 grid-area: f1;
 
}
.fo2 {
 grid-area: f2; 	
}
.fo3 {
 grid-area: f3;
}
.fo4 {
 grid-area: f4;
}
 
.fo1::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0px;
    left: 0;
    width: 100%;
    height: 60px;
    background-image: linear-gradient(rgba(34,34,34,.4),transparent);
}   
.fo1::after {
    content: "";
    position: absolute;
    z-index: 1;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 70px;
    background-image: linear-gradient(transparent, rgba(34,34,34,.9));
}
.fo1::after {
    content: "";
    position: absolute;
    z-index: 1;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 70px;
    background-image: linear-gradient(transparent, rgba(34,34,34,.9));
}
.oim1::after { 
    content: "";
    position: absolute;
    z-index: 1;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 70px;
    background-image: linear-gradient(transparent, rgba(34,34,34,.9));
}

/*.fo img {
	width: 100%
}*/
.photis { position: absolute; bottom: 0; left: 0px; right:0; width: 100%; z-index: 20; margin-top: -2px;
  color: #bbb; /*padding: 2px; padding-left: 4px;  */  text-align: center;}

.photis a {/* background-color: rgba(0,0,0,.5); */color: #eee; padding: 4px; padding-right: 6px;
  text-transform: uppercase; font-weight: 700; font-size: 10px; width: 100%; display: block;
  background-image: linear-gradient(rgba(0,0,0,.2), rgba(0,0,0,.8));
   }
.photis a:hover {  background-color: rgba(0,0,0,.5);  text-decoration: none; color: #fff }
.photis img { opacity: 0.8; height: 16px;  }
.photis b { padding: 2px 3px 3px; opacity: 0.8; color: #eee; font-weight: 900; }
.photis .lnk i { opacity: 0.8; display: none }
 


#blo { background-color: #ECEEEF; 
display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	align-content: stretch;
}


#t { border-top: 4px solid #222;  }
#ti { background-color: #fff; margin-top: -4px; }
#t .container-fluid { padding-left: 10px; padding-right: 10px; }

.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
}
.shadow-lg {
    box-shadow: 0 .125rem .4rem rgba(0,0,0,.3)!important;
}

.mono {
	 font-family: 'Courier New', Courier, monospace;
}
 
.goc {
  box-sizing: border-box;
  margin: 0;
  padding: 0;   
  display: grid;
  grid-template-columns: 2fr 6fr;
  grid-template-rows: 1fr 1fr;
  grid-template-areas: 
    "gcblue gcred"
    "gcyellow gcred";
  width: 100%;
  height: 300px;
}
 .gcred, .gcblue, .gcyellow {
    heigth: 100%;
    width: 100%;
    font-size: 25px;
    text-align: center;
  
}

.gcred {
  grid-area: gcred;
}
.gcblue {
  grid-area: gcblue;
}
.gcyellow {
  grid-area: gcyellow;
}


/*circle before*/
.cr,
.cr::before {
  display: block;
  box-sizing: border-box;
  border-radius: 100%;
  width: 100px;
  height: 100px;
  position: absolute;
  background-color: transparent;
  padding: 0;
  margin: 0;
}
.thin {
	font-weight: 400;
}
.label-one {
	font-size: 12px !important; color: #ccc !important; background-color: #444 !important;
	font-weight: 700 !important; padding: 4px 8px;
}
.label-pro {
	font-size: 16px !important;
}
.m--10 {
	margin-top: -10px;
}
.m--15 {
	margin-top: -15px;
}
.m--30 {
	margin-top: -30px;
}
.cr {
  border: solid #00BBEE 12px;
  clip: rect(0px, 100px, 50px, 0px);
  margin: 25px;
}
:root{
/*--deg: 10deg;*/
}
.cr::before {

  content: '';
  border: solid #EEBB00 12px;
  top: -12px;
  left: -12px;
  clip: rect(0px, 100px, 50px, 0px);
  transform: rotate(var(--deg));

  /* define the fill length, using the rotation above.
     from -180deg (0% fill) to 0deg (100% fill) */
  /* if you have a better solution to make thing like this 
     work, please let me know! :) */
}

/* PieChart do przeniesienia*/
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}

.easyPieChart {
    position: relative;
    text-align: center;
}

.easyPieChart canvas {
    position: absolute;
    top: 0;
    left: 0;
}

.chart {
    float: left;
    margin: 10px;
}

.percentage,
{
    text-align: center;
    color: #333;
    font-weight: 100;
    font-size: 1.2em;
    margin-bottom: 0.3em;
}
/*.label*/
#topf .label-group {
	color: #333;
	font-size: 1.2em;
}

.credits {
    padding-top: 0.5em;
    clear: both;
    color: #999;
}

.credits a {
    color: #333;
}

.dark {
    background: #333;
}

.dark .percentage-light,
.dark .label {
    text-align: center;
    color: #999;
    font-weight: 100;
    font-size: 1.2em;
    margin-bottom: 0.3em;
}


.button {
  -webkit-box-shadow: inset 0 0 1px #000, inset 0 1px 0 1px rgba(255,255,255,0.2), 0 1px 1px -1px rgba(0, 0, 0, .5);
  -moz-box-shadow: inset 0 0 1px #000, inset 0 1px 0 1px rgba(255,255,255,0.2), 0 1px 1px -1px rgba(0, 0, 0, .5);
  box-shadow: inset 0 0 1px #000, inset 0 1px 0 1px rgba(255,255,255,0.2), 0 1px 1px -1px rgba(0, 0, 0, .5);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  padding: 6px 20px;
  font-weight: bold;
  text-transform: uppercase;
  display: block;
  margin: 0 auto 2em;
  max-width: 200px;
  text-align: center;
  background-color: #5c5c5c;
  background-image: -moz-linear-gradient(top, #666666, #4d4d4d);
  background-image: -ms-linear-gradient(top, #666666, #4d4d4d);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#666666), to(#4d4d4d));
  background-image: -webkit-linear-gradient(top, #666666, #4d4d4d);
  background-image: -o-linear-gradient(top, #666666, #4d4d4d);
  background-image: linear-gradient(top, #666666, #4d4d4d);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#4d4d4d', GradientType=0);
  color: #ffffff;
  text-shadow: 0 1px 1px #333333;
}
.button:hover {
  color: #ffffff;
  text-decoration: none;
  background-color: #616161;
  background-image: -moz-linear-gradient(top, #6b6b6b, #525252);
  background-image: -ms-linear-gradient(top, #6b6b6b, #525252);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#6b6b6b), to(#525252));
  background-image: -webkit-linear-gradient(top, #6b6b6b, #525252);
  background-image: -o-linear-gradient(top, #6b6b6b, #525252);
  background-image: linear-gradient(top, #6b6b6b, #525252);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b6b6b', endColorstr='#525252', GradientType=0);
}
.button:active {
  background-color: #575757;
  background-image: -moz-linear-gradient(top, #616161, #474747);
  background-image: -ms-linear-gradient(top, #616161, #474747);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#616161), to(#474747));
  background-image: -webkit-linear-gradient(top, #616161, #474747);
  background-image: -o-linear-gradient(top, #616161, #474747);
  background-image: linear-gradient(top, #616161, #474747);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#616161', endColorstr='#474747', GradientType=0);
  -webkit-transform: translate(0, 1px);
  -moz-transform: translate(0, 1px);
  -ms-transform: translate(0, 1px);
  -o-transform: translate(0, 1px);
  transform: translate(0, 1px);
}
.button:disabled {
  background-color: #dddddd;
  background-image: -moz-linear-gradient(top, #e7e7e7, #cdcdcd);
  background-image: -ms-linear-gradient(top, #e7e7e7, #cdcdcd);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#e7e7e7), to(#cdcdcd));
  background-image: -webkit-linear-gradient(top, #e7e7e7, #cdcdcd);
  background-image: -o-linear-gradient(top, #e7e7e7, #cdcdcd);
  background-image: linear-gradient(top, #e7e7e7, #cdcdcd);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7e7e7', endColorstr='#cdcdcd', GradientType=0);
  color: #939393;
  text-shadow: 0 1px 1px #fff;
}

.Hlead {
	background-color: #666; padding: 8px 12px;  }
.Hlead h3 {
	color: #fff; font-size: 20px; padding: 4px 10px;
}
.bgmod {
	background-color: #F5F5F5
}
/* register */

/**
ADD
**/

/* 
	PAKIETY
   all 5 level */ 
 .packs {
 	 display: flex;
 }
.level-o {
	padding: 0px 4px 4px;
}

.packs a:hover {
	 background-color: #fff;
}
.packs p {

	margin-bottom: 0px;
}
.packs li {
	min-width: 250px;
}
.packs .packinfo {
	color: #666;
}
.packs .packinfo span {
	color: #999; text-transform: uppercase;
}
.packs .packinfo img {
	 opacity: 0.5;
}
.packs .packinfo strong {
	font-size: 20px; line-height: 18px;
}
.packs .packinfo div {

}

.packs .disabl .packinfo img { opacity: 0.2 }

.packs .disabl .packinfo { color: #aaa; }

a.level-option {
	display: block;
	color: #111;
	text-decoration: none !important;
}
a:hover.level-option {
	 text-decoration: none;
}

.pack-df {
display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: stretch;
}
.pack-df > div { margin-right: 10px; }
.level-option {
  -webkit-border-radius:2px;-moz-border-radius:2px;
  margin:2px; border:1px solid #aaa; 
  background-color: #fff; 
  padding: 6px 8px; cursor:pointer; position:relative;
  text-decoration: none;
}
.level-option:hover{ margin:0px; border-width:3px; border-color:#F0AB00 }


.level-option.disabl {
	 color: #aaa !important;
	 border-color: #ccc; 
}
.level-option.disabl small,
.level-option.disabl .hs1,
.level-option.disabl span,
.level-option.disabl sup,
.level-option.disabl .hs2 {
	color: #aaa !important;
}
.level-option.disable i {
	filter:alpha(opacity=50);
	opacity: 0.5;
	-moz-opacity:0.5;
}

.level-option.selected{ background-color:#F0AB00; border-color: #F0AB00; }
.level-option.selected:hover{margin:0px;border-width:3px;border-color:#F0AB00}
.level-option.selected p{ color:#333 }
.level-option.selected h1{color:#333; }
.level-option.selected hr {
	border-top:1px solid #C58C00;
}

.level-option hr {
	margin: 5px 0px; border-bottom: 0px; border-top:1px solid #ccc;
}

.level-option small { color: #333; font: bold 10px Arial; 
	line-height: 10px; text-transform: uppercase; }
.level-option .zl { color: #333; font: bold 11px Arial; 
	line-height: 11px; text-transform: uppercase; }
.level-option .hs2{ color: #242424; /*#C8C8C8*/ font-size: 18px;  text-transform: uppercase; line-height: 16px; }
.level-option .hs1{ font: normal 26px Arial; display: block; float: right; }

.level-option .unit_vat { font: normal 10px Arial; color: #222;  }
.level-option .unit_credits { font-weight: bold; color: #222; }

.level-option .unit_type { color: #222; font: normal 18px Arial; line-height: 20px; padding-right: 2px; }

.level-option p{  color:inherit}
/*.level-option.last{margin-bottom:0px !important}*/
/*
div#level-more-info-box{display:none}
div#level-more-info-box p{float:left;width:212px;padding:0px 10px 15px 0;margin-right:8px}
div#level-more-info-box p.last{margin-right:0px}
*/
 
/* add modal packets */
.moadd.card { padding: 0px; }
.moadd h5 { padding: 8px 8px 5px; }
.moadd .card-title { color: #333; }
.moadd .card-text { padding: 0px 8px 5px; font-size: 11px; font-weight: 400; }
.moadd .list-group-item { padding: 0px; }
.moadd .list-group-item a img { opacity: 0.4 }
.moadd .list-group-item a { color: #003B68; display: block; padding: 5px; }
.moadd .list-group-item a:hover { color: #111; text-transform: none; text-decoration: none; background-color: #F6D983; }
.moadd .list-group-item a:hover img { opacity: 0.8 }
.moadd .dis { padding-left: 5px; }
  .moadd .dis img { opacity: 0.8 }
#bpro { background-color: #6E6E6E; height: 100px; overflow: hidden }

.bmedium { border-width: medium; }
.label-black { color: #fff !important; background-color: #000 !important; font-weight: 900; }

/*.moadd2 { border:0px; background: #FFC001 }
.moadd2 .list-group-item { background-color: transparent;  }

.moadd2 .list-group { background-color: #686868; background-color: #FFC001; }
.moadd2 .list-group a { color: #333; padding: 2px 6px; }
.moadd2 .list-group a:hover { color: #111; }*/

#saleas h5 {
	color: #333; font-size: 13px;
}
#saleas p {
	 font-weight: 300; font-size: 12px; margin-bottom: 0px;
}
#saleas .panel-title {
	margin-bottom: 0px; font-weight: 900;
}
#saleas .panel-heading {
	padding: 8px; padding-bottom: 0px;
}
#saleas .radio {
	 margin-bottom: 0px;
}
#saleas .panel-collapse {
	padding: 0px 10px 10px 10px;
}
#saleas .list-group-flush {
	margin-top: 5px;
}
#saleas .list-group-flush .list-group-item {
	padding: 5px;
	font-weight: 300;
	font-size: 10px;
}

body.themeBrown .app-aside {
	background-color: #555;
	border-right: 1px solid #444;
}

#aside-footer {
  margin-top: 100px; line-height: 14px;
  color: #aaa; font-size: 10px; 
  padding: 10px;
  /*position:absolute; bottom: 0;*/
}
.app-aside-folded #aside-footer {
	 display: none;
}
.app-aside .footer {
	position: absolute; bottom: 0px; left: 0px;
}

.ahr {
	color: #666;
}
.inline {
	display: inline;
}
.cg .input-group-addon {
	 border: 0px; background-color: transparent;
}

/**add.wizard*/
/* root wizard*/
#regspec .form-input-group .form-control { height: 29px; min-height:29px; }
#rootwizard { background-color: #5C5C5C; }
#rootwizard .badge { background-color:#818181; color: #eee; font-size: 14px; display: inline; }
#rootwizard a { font-size: 16px; color: #eee }

#rootwizard .nav-tabs-linetriangle > li > a.active:after, 
#rootwizard .nav-tabs-linetriangle > li > a.active:before {
      transform: rotate(180deg);
      border-top-color: #fff;
      top: 60%;
}

#rootwizard .input-group-append span { min-width: 30px !important; }

/*
  #ADD
  background-color: #C30006; color: #E17F82;
*/
.section-header.proces { padding: 0px; margin-top: 10px; }
.aktualny { background-color: #777; font-family: Inter, Arial; margin-right: 10px; padding: 4px 32px 8px 10px; font-weight: 800 }
.aktualny h5 { padding: 6px 10px 0px 10px; font-size: 11px; color: #bbb; margin: 2px; text-transform: uppercase; }
.proces { }
.proces h3 { color: #444; font-size: 24px; font-family: Inter, Arial; font-weight: 800; letter-spacing: -1px; padding-top: 4px; margin-bottom: 0px;}
.proces p { font-size:16px; color: #777; font-weight: 400; font-family: Inter, Arial; }
.stepActive { font-size:30px; color: #fff; line-height: 28px; }
.stepAll { font-size: 20px; color: #ccc; padding-left: 2px;}

#addSteps a {
	color: #222; text-transform: uppercase;
}
#addSteps a > i {
	font-size: 1.5em; color: #777; top: 0;
}
	#addSteps li.active a {
		background-color: #ddd; 
	}
	#addSteps li.opened a {
		background-color: #ccc;
	}
#brande {
	margin-top: -6px;
}
.nowrap { white-space: nowrap; }
.over { overflow:hidden; }
#infi { display: none; }
.menu-pin #infi { display: block; }
.infa { font-size: 16px; text-transform: uppercase; }
.infa small {
  text-transform:uppercase;
  font-size: 11px;
  color: #888; display: block; line-height: 10px;
  margin-top: 5px;
}
.infa strong {
	color: #111;
}
.infa u { display: block; font-weight: 600; font-size: 14px; line-height: 14px; text-decoration: none;}
#i0 {
	background-color: #2d353c;
}
#i0 img {   -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%); }

.btd { border-top: 1px dotted #ccc; }


/* add select car */
.vcar { color: #666; width: 64px; display: block; opacity: 0.3; margin-top: 5px; }
#D1 > div {
	 height: 54px;
}
#D1 .op { padding: 10px 0px 5px 10px; }
#D1 .op:hover {  background-color: #E1F3FF; }
#D1 .op label .mrk { margin-top: -5px; }
#D1 .radio label:before { bottom: initial !important; top:3px;  }
#D1 .op label span { font-weight: bold; color: #000; font-size: 14px; }

#D2 .op label { padding: 2px;  }
#D2 .op { padding: 5px; padding-left: 25px; }
#D2 .op strong { font-size: 14px; color: #000;  }
#D2 .op:hover { background-color: #E1F3FF;  }

#D3 .op { padding: 10px; padding-left: 15px;  }
#D3 .op label {
	 padding-top: 8px;
}
#D3 .op strong { font-size: 17px; color: #000;  }
#D3 .op:hover { background-color: #E1F3FF;  }

#D4 .op label {
	padding-top: 5px; margin-top: 4px;
}
#D4content .head-3 {
	text-transform: uppercase; font-size: 11px; font-weight: 300;
}
#D4content .op strong { font-size: 14px; color: #000; }
#D4content .op:hover { background-color: #E1F3FF;  }

#D6content .p-2 {
	padding-top: 10px; color: #444;
}
#D6content .cylindry {
	background-color: #888;
}
#tab5 .op {
	margin-top: 5px;
}
#tab5 .op strong { font-size: 14px; color: #000; }
#tab5 .op:hover { background-color:#E1F3FF;  }

.label-fuel {
	padding: 1px 3px;
}
.label-fuel.pb { background-color: darkgreen; color: #fff; }
.label-fuel.on { background-color: #000; color: #fff }
.label-fuel.lpg { }

#D6content .op {
	padding-top: 5px; margin-top: 5px;
}
#D6content label{
	 margin-top: 5px;
}
#D6content .op strong { font-size: 18px; color: #000; }
#D6content .op:hover { background-color:#E1F3FF;  }



.blok.engine { width: 27px; height: 40px; position: relative; margin-right: 14px; }
.engine { background-image: url('/img/ico/engines.png'); background-size: 100px; float: left; margin-right: 5px;  }
/*.engine.r { display: inline-block; width: 27px; height: 40px; background-position: 0px 0px; }*/
.engine.v { display: inline-block; width: 32px; height: 40px; background-position: -25px 0px; }
.engine.w { display: inline-block; width: 40px; height: 40px; background-position: -60px 80px; }
.cylindry { position: absolute; top: 5px; right: -10px; display: inline; padding: 2px 4px; }


#Tcontent .op strong { font-size: 14px; color: #000; }
#Tcontent .op:hover { background-color:#eee;  }
#Tcontent img { -webkit-filter: grayscale(100%);
    filter: grayscale(100%); }
#Tcontent .radio label:before { bottom: auto; top: 10px; }

.label-fuel.pb { 
  fill: green; 
}

.bdc { border-top: 1px dashed #ccc }
.bda { border: 1px dashed #ccc }
.no-b-r { border-right: 0px;}

.bdc .label-fuel {
	 padding: 4px;
}

.selected_version { border: 2px solid #FFB401; }
.ver_more { 
 margin-top: 10px;
 padding: 5px 10px;
 background-color: #f8f8f8;
}
.ver_more .options { font-size: 11px; text-transform: uppercase; padding-bottom: 10px; }

#rootwizard .nav-tabs .disabled {
	color: #aaa;
}
#rootwizard .nav-tabs .disabled .badge {
background-color: #717171; 
	color: #ccc;
}
#rootwizard .nav-tabs {
	padding: 5px 6px;
}
#rootwizard .nav-tabs .nav-link {
	border-bottom: 0px !important;
}
#rootwizard .nav-tabs .badge {
	padding: 5px 10px;
	border-radius: 20px;
}
#rootwizard .nav-tabs > li > a.active:before,#rootwizard .nav-tabs > li > a.active:after {
	border-top-color: #5c5c5c;
}
.letter-1 {
	letter-spacing: -1px;
}

.nav-tabs ~ .tab-content > .tab-pane.slide-left,
.nav-tabs ~ .tab-content > .tab-pane.slide-right {
  -webkit-transition: all 0.3s ease !important;
  transition: all 0.3s ease !important;
}
.nav-tabs ~ .tab-content > .tab-pane.slide-left.sliding,
.nav-tabs ~ .tab-content > .tab-pane.slide-right.sliding {
  opacity: 0 !important;
}
.nav-tabs ~ .tab-content > .tab-pane.slide-left.active,
.nav-tabs ~ .tab-content > .tab-pane.slide-right.active {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -ms-transform: translate(0, 0);
  opacity: 1;
}
.nav-tabs ~ .tab-content > .tab-pane.slide-left.sliding {
  -webkit-transform: translate3d(10%, 0, 0) !important;
  transform: translate3d(10%, 0, 0) !important;
  -ms-transform: translate(10%, 0) !important;
}
.nav-tabs ~ .tab-content > .tab-pane.slide-right.sliding {
  -webkit-transform: translate3d(-10%, 0, 0) !important;
  transform: translate3d(-10%, 0, 0) !important;
  -ms-transform: translate(-10%, 0) !important;
}

.radio-info.disabled {
	opacity: 0.5;
}
.wait {
	text-align: center;
	padding: 50px 20px;
	font-weight: 300;
	font-size: 36px;
}

h4.hf {
	font-size: 28px; font-weight: 500; padding: 10px 0px; color: #111; 
	padding-bottom: 20px;
}

/* Layout mod */
body.app-aside-folded .app-wrapper .app-aside {
    overflow-x: visible;
    width: 60px;
}
body.app-aside-folded .app-wrapper .app-aside .aside-wrapper {
    width: 60px;
}
@media (min-width: 768px) {
	
	body.app-aside-fixed .app-aside {
    	position: fixed;
    	top: 48px;
    	bottom: 0;
    	width: 220px;
    	overflow-y: auto;
    	z-index: 1010;
	}

}

.colp {
    position: relative;
    overflow: hidden;
    vertical-align: middle;
    display: inline-block;
    width: calc(1em * 1.5);
    height: calc(1em * 1.5);
    margin-right: 8px;
    border: 1px solid var(--color-neutral-300);
    border-radius: 50%;
    background-clip: content-box;
    flex-shrink: 0;
}
.color-link {
    width: 29px;
    height: 29px;
}
.color-link {
    width: 38px;
    height: 38px;
    border-radius: 4px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.color--brown {
    background-image: radial-gradient(circle at 39% 24%,#d29d68,#85430c);
}
.color--silver {
    background-image: radial-gradient(circle at 38% 22%,#fff,#dadada);
}

/*add*/
.eltxt {
	font-weight: 400;
	color: #555
}
.form-group-under {
	border-bottom: 1px solid #ccc; padding-bottom: 6px;
}
	.form-group-under .simple-list li label { color: #444; }

.form-group label.fai, label.fai {
	font-size: 12px; text-transform: uppercase; font-weight: 600; color: #000;
}


.lh-normal {
	line-height: 1rem !important;
}

.uppy-Dashboard-inner {
	 background-color: #fff;
}

/* add */
.wyp-list {
	border-top: 0px;
}
.wyp-wer {
	background-color: #fff; 
	border-top: 1px solid #eee; border-left: 1px solid #eee; border-right: 1px solid #eee;
	/*border-bottom: 10px solid #F9F9FA !important;*/
	/*border-bottom: 10px solid #FFF !important;*/
	border-bottom: 0px !important;
	padding: 0px !important;
	margin-top: 0px;
	margin-left: 0px !important;

}
.wyp-wer label {
	 padding: 8px;
}
.wyp-wer .wp {
	background-color: #ddd;
	padding: 8px; 
	/*border-bottom:1px solid #eee;  border-bottom: 1px solid #ddd;*/
	overflow: hidden;
	margin-bottom: 8px;
	/*
-webkit-box-shadow: 0px 6px 4px -8px rgba(44, 45, 51, 1);
-moz-box-shadow: 0px 6px 4px -8px rgba(44, 45, 51, 1);
box-shadow: 0px 6px 4px -8px rgba(44, 45, 51, 1);*/
}
.wyp-wer .wp .label {
	font-weight: 400; border-color: #dfdfdf; background-color: #f4f4f4; color: #999; margin-right: 4px;
}
.wyp-wer .wp p {
	-webkit-mask-image: linear-gradient(90deg, #000 70%, transparent); display:flex;
	margin-bottom:0px; 
}


/* of10 - not works in sale*/

body.app-aside-folded .app-wrapper .app-aside .nav-wrapper > .main-nav > li > a > i {
	opacity: 0.5;
	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
    filter: grayscale(100%);
}

.uppy-Root {
	 font-family: Inter, Arial !important;
}
.uppy-Root .uppy-Dashboard-inner {
	border: 0px; background-color: #fff;
}
.uppy-Dashboard-browse {
	 font-weight: 800;
}

div.karta {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



.path__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 100%;
    margin: 0 auto;
}
.item-path__icon {
    margin-top: 0;
    margin-bottom: 16px;
}
.item-path {
    width: 100%;
    /*max-width: 232px;*/
    position: relative;
    counter-increment: path-item;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    font-weight: 400;
}
.item-path h3 {
	color: #222;
}

.item-path::after {
    font-size: 200px;
    line-height: 145px;
    z-index: -1;
    color: #fff;
    right: 30%;
    top: 20%;
    content: counter(path-item);
    position: absolute;
    font-weight: 800;
}
.item-path__title {
    font-size: 14px;
    color: #aaa;
    line-height: 24px;
    /*max-width: 220px;*/
    font-weight: 600;
    padding-right: 40%
}

  .cround
    {
        -moz-border-radius: 25px;
        border-radius: 25px;
        padding: 5px 10px;
        border: 5px solid #aaa; font-weight: 900; font-size: 18px;
    }

#steps-marka { background-color: rgba(255, 255, 255, .8)}    
#steps-marka:hover { background-color:#004C78; color: #fff; }

.account-lead { font-weight: 600; font-size: 16px; }