/*
Theme Name: Skarby Rosji v2
Author: SONETS - Usługi informatyczne (biuro@sonets.pl)
Author URI: https://www.sonets.pl
Description: Szablon dla Skarby Rosji
Version: 1.0
*/

/*SETTINGS*/
@import url('https://fonts.googleapis.com/css2?family=Muli:wght@300;400;500;600;700&display=swap');
h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
}
body, input, textarea, button, select {
	font-family: 'Muli', sans-serif;
	font-size: 15px;
	color: rgb(64, 64, 64);
}
html, body {margin:0;padding:0;height:100%;}
*, ::after, ::before {
    box-sizing: border-box;
}
.container {
	width: 100%;
	padding: 0px 30px;
}
/*SETTINGS*/

/*BALANCE*/
label.check_balances {
	font-size: 15px;
	border: 2px dashed #eee;
	padding: 5px 10px;
}
label.check_balances input {
	margin: 0px 1px 0px 0px;
}
.balance .count {
	font-size: 20px;
	margin-bottom: 25px;
}
.balance .count span,
table.customers span,
.balance table span,
.balance-info span {
	font-weight: 700;
}
li.balance span {
	font-weight: 700;
	vertical-align: middle;
	font-size: 11px;
	color: #aaa;
}
.balance span.up,
table.customers span.up,
.balance-info span.paid {
		color: #0b0;
}
.balance span.down,
table.customers span.down,
.balance-info span.unpaid {
		color: red;
}
.balance .cars {
	text-align: right;
	line-height: 1.4;
	margin-top: -12px;
}
.balance-info {
	text-align: center;
	margin-top: 15px;
}
.balance-info a {
	display: inline-block;
}
.balance-info .box {
	text-align: center;
	display: inline-block;
	line-height: 1.3;
	border: 2px dashed red;
	padding: 10px 20px;
}

/*BALANCE*/

/*FILES*/
.dropzone {
	min-height: auto !important;
	border: 1px dashed rgba(0, 0, 0, 0.31) !important;
}
.dropzone .dz-message {
	font-size: 22px;
}
.row.files {
	margin-top: 25px;
}
.files .c4 {
	padding: 10px;
	text-align: center;
}
.files h3 {
	padding: 15px 0px 20px 0px;
	font-weight: 600;
	font-size: 16px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.files .hidden {
	overflow: hidden;
	background-size: cover;
	height: 250px;
	background-repeat: no-repeat;
	background-position: center center;
}
.files .documents .hidden {
	background-size: 90px;
}
.files .shadow {
	position: relative;
	padding: 20px 20px 0px 20px;
	box-shadow: 0px 0px 5px 0px #d2d2d2;
}
.files .shadow:hover {
	box-shadow: 0px 0px 5px 0px #999;
}
.files a {
	display: block;
}
.files a.delete {
	position: absolute;
	font-size: 25px;
	top: 7px;
	right: 7px;
	opacity: 0.3;
}
.files a.delete:hover {
	opacity: 0.8;
}
/*FILES*/

/*BUTTONS*/
a.btn-big {
	background: linear-gradient(180deg, #FDC300 0%, #FF9F00 100%);
	border-radius: 3px;
	padding: 15px 20px;
	display: inline-block;
}
a.btn-big:hover {opacity: 0.8;}
.btn-small {
	display: inline-block;
	border: 1px solid;
	border-radius: 3px;
	padding: 10px 15px;
}
.btn {
	border: 1.5px solid;
	padding: 12px 20px;
	line-height: 1;
	cursor: pointer;
	border-radius: 3px;
	display: inline-block;
}
.btn-green {border-color: #373737;}
.btn-green:hover {border-color: #219b1e;background:#219b1e;color:white;}
.btn-grey {border-color: #e7e7e7;}
.btn-grey:hover {background: #e7e7e7;}
.btn-orange {border-color: #e7e7e7;}
.btn-orange:hover {background: rgb(253, 194, 0);border-color:rgb(253, 194, 0);}
/*END BUTTONS*/

/*FORMS*/
.add-new {
	display: block;
	padding: 10px 5px;
	text-align: center;
	font-size: 13px;
	background: #e7e7e7;
	text-transform: uppercase;
}
.select2-container {
	width: 100% !important;
}
.required {
	border-color: #e12929 !important;
	box-shadow: 0px 0px 2px 0px #e12929;
}
ul.tabs{
	margin: 0px;
	padding: 0px 11px;
	list-style: none;
	border-bottom: 1px solid #E7E7E7;
	font-size: 16px;
}
ul.tabs li{
	background: none;
	color: #222;
	display: inline-block;
	padding: 10px 15px;
	cursor: pointer;
	position: relative;
}
ul.tabs li.current:after{
	content: '';
	height: 2.5px;
	background: #FDC300;
	width: 100%;
	position: absolute;
	bottom: -1.5px;
	left: 0px;
}
.tab-content h2:first-child {
	margin-top: 0px;
}
.tab-content h2 {
	font-weight: 400;
	margin-bottom: 30px;
	font-size: 19px;
}
.tab-content {
	padding: 30px 0px;
	display: none;
}
.tab-content.current{
	display: inherit;
}
.alert  {
	padding: 20px;
	font-size: 13px;
	margin: -10px auto 20px auto;
	width: 100%;
	border-radius: 3px;
	position: relative;
}
.alert li {
	display: block;
	margin-bottom: 15px;
}
.alert li:last-child {
	margin: 0;
}
.alert li:before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	margin-right: 6px;
	width: 6px;
	height: 6px;
	background: white;
}
.alert button {
	position: absolute;
	right: 10px;
	top: 5px;
	font-size: 20px;
	cursor: pointer;
	color: white;
}
.alert-danger {
	background: #f40f0f;
	color: white;
	box-shadow: 0px 0px 2px 0px #f40f0f;
}
.alert-success {
	background: #37b925;
	color: white;
	box-shadow: 0px 0px 2px 0px #37b925;
}
.alert-warning {
	background: #ffbf00;
	box-shadow: 0px 0px 2px 0px #ffbf00;
}
.form-group {
	position: relative;
	padding: 0px 10px;
	margin-bottom: 30px;
}
.form-group .error {
	font-size: 13px;
	color: #cc3232;
	margin: 8px 0px -10px 0px;
	display: block;
	text-align: center;
}
label.important {
	display: block;
	margin-top: 14px;
	font-size: 14px;
}
label.top {
	position: absolute;
	background: white;
	z-index: 1;
	font-size: 10px;
	color: #999;
	font-weight: 600;
	left: 20px;
	top: -5px;
	cursor: auto;
}
label {
	cursor: pointer;
}
input#vin:focus,
input#nip:focus,
input#regon:focus {
	letter-spacing: 2.5px;
}
input.text, textarea.text {
	margin: 0px;
	border: 1px solid #E7E7E7;
	border-radius: 3px;
	padding: 10px;
	width: 100%;
	font-size: 13px;
}
.select2-container--default .select2-selection--single {
	padding: 5px 0px;
	width: 100%;
	font-size: 13px;
	height: 38px !important;
}
.select2-selection__arrow {
	height: 38px !important;
	top: 0px !important;
	right: 3px !important;
}
form .currency select {
	-moz-appearance:none; /* Firefox */
	-webkit-appearance:none; /* Safari and Chrome */
	appearance: none;
  border: 1px solid #e7e7e7;
  width: 60px;
  height: 38px;
  font-size: 13px;
  position: absolute;
  right: 10px;
  top: 0px;
  padding: 0px 0px 0px 5px;
}
form .currency:after {
	content: '';
	border-color: #888 transparent transparent transparent;
	border-style: solid;
	border-width: 5px 4px 0 4px;
	height: 0;
	right: 20px;
	position: absolute;
	top: 46%;
	width: 0;
}
textarea.text {
	resize: vertical;
	height: 200px;
	min-height: 100px;
	max-height: 500px;
}
input:focus, textarea:focus, .currency select:focus {
	box-shadow: 0px 0px 5px 0px #bdbdbd;
}
::placeholder {
	color: #b7b7b7;
	opacity: 1;
}
::-ms-input-placeholder {
	color: #b7b7b7;
	opacity: 1;
}
::-ms-input-placeholder {
	color: #b7b7b7;
	opacity: 1;
}
form select {
	width: 100%;
}
/*END FORMS*/

/*TABLES*/
span.status.status {
	display: block;
	border-radius: 3px;
	text-align: center;
	padding: 8px 5px;
	text-transform: uppercase;
	width: 100%;
}
span.status.auction {
	color: #0074B6;
	background: rgb(160, 221, 255);
}
span.status.sell {
	color: #037700;
	background: rgb(175, 213, 175);
}
span.status.warehouse {
	color: #333333;
	background: rgb(217, 217, 217);
}
span.status.given {
	background: rgb(255, 223, 53);
}
span.status.paid {
	background: rgb(254, 159, 0);
	color: #fff;
}
.curr_convert {
	font-size: 11px;
	margin-top: 5px;
	display: block;
	color: #c1c1c1;
}
.paginate_button {
	background: none !important;
	border-radius: 100%;
	width: 35px;
	height: 35px;
	line-height: 34px;
	padding: 0px !important;
	cursor: pointer !important;
	font-weight: 500;
	color: #999999;
}
span.ellipsis {
	color: #999999;
}
.paginate_button.current,
.paginate_button:hover {
	color: rgb(64, 64, 64);
	border: 1px solid #e7e7e7 !important;
}
.dataTable {
	margin-top: 15px !important;
}
.dataTable input.filter {
	color: red;
	border: 1px solid #e7e7e7;
	border-radius: 3px;
	padding: 7px 10px;
	width: 100%;
	box-sizing: border-box;
	font-size: 13px;
}
.dataTables_filter input[type="search"] {
	color: red;
	font-size: 13px;
}
.dataTables_length {
	margin-top: 20px;
}
.dataTables_length select {
	border: 0px;
	background: none;
}
.dataTables_info,
.dataTables_length,
.dataTables_length select {
		font-size: 13px;
}
.dataTables_info {
	padding-top: 5px !important;
}
.dataTables_paginate {
	padding: 0px !important;
	margin-top: -17px;
}
table.dataTable td:first-child {
    width: 5%;
		font-size: 11px;
    text-align: center;
}
table.cars td:nth-child(2) {
	font-size: 11px;
}
table.dataTable tbody th, table.dataTable tbody td {
	padding: 7px 5px !important;
}
table.dataTable tr.important {
	background: #ffeaea !important;
}
table.dataTable td.dataTables_empty {
	padding: 70px 0px !important;
}
table.dataTable tbody tr:hover {
	background: #eee !important;
}
table.dataTable tbody tr.important:hover {
	background: #f7d2d2 !important;
}
table.dataTable {
	width: 100% !important;
}
table.dataTable {
	border-collapse: collapse;
}
table.dataTable td {
	vertical-align: middle;
	font-size: 14px;
	line-height: 1.2;
}
table.dataTable tr {
	border-bottom: 1px solid #e7e7e7;
}
table.dataTable tr:last-child {
	border: 0px;
}
table.dataTable th {
	border: 0px !important;
	padding: 5px !important;
	font-size: 13px;
	vertical-align: middle;
}
table.dataTable td:last-child {
	width: 5%;
	text-align: center;
}
table.dataTable th:last-child {
	display: none;
}
table.dataTable tfoot {
	 display: table-header-group;
}
.dataTables_wrapper input:focus {
	box-shadow: 0px 0px 3px 0px #e1e1e1;
}
.dataTables_filter input[type=search] {
	padding: 8px 10px;
	border: 1px solid #e7e7e7;
	border-radius: 3px;
	margin: 0px !important;
}
.dataTables_filter label {
	position: relative;
	display: block;
}
.dataTables_filter label:after {
	content: "\f002";
	font-family: 'Line Awesome Free';
	font-weight: 900;
	display: block;
	position: absolute;
	top: 9px;
	right: 8px;
	font-size: 18px;
}
ul.edit li {
	position: relative;
	display: block;
}
ul.edit i {
	font-size: 30px;
}
ul.edit i:hover,
ul.edit ul li a:hover {
	color: #219b1e;
}
ul.edit ul {
	display: none;
	background: #fff;
	position: absolute;
	z-index: 1;
	right: 30px;
	top: 0px;
	border-radius: 5px;
	box-shadow: 0px 0px 2px 0px #a4a4a4;
}
ul.edit ul li a {
	display: block;
	padding: 10px 30px;
	border-bottom: 1px solid #ddd;
	font-size: 13px;
}
ul.edit ul li:last-child a {
	border: 0px;
	color: red;
}
ul.edit li:hover ul {
	display: block;
}
.dt-buttons {
	display: inline-block;
}
a.dt-button {
	cursor: pointer;
	display: inline-block;
	border: 1px solid #e7e7e7;
	border-radius: 3px;
	padding: 7px 10px;
	margin-right: 10px;
}
a.dt-button:hover {
	background: #e7e7e7;
}
.dt-button i {
	font-size: 20px;
	vertical-align: sub;
}
.dt-button i.fa {
	display: none !important;
}
/*END TABLES*/

/*HEADER*/
.header {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 85px;
	border-bottom: 1px solid #F2F2F2;
	position: relative;
	z-index: 3;
	background: white;
}
.header .logo img {
	max-width: 206px;
}
.header .logo {
	padding: 0px 15px;
	min-width: 250px;
	float:left;
}
.header .line {
	width: calc(100% - 250px);
	float: left;
}
.header .c2.user {
	text-align: right;
	padding: 5px 15px 0px 0px;
}
.header .info {
	font-size: 20px;
	line-height: 16px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 15px;
}
.header .info span {
	font-size: 13px;
	font-weight: 300;
}
.header .user a {
	vertical-align: middle;
}
/*END HEADER*/

/*MENU*/
.menu-left.hide {
	width: 70px;
	overflow: hidden;
}
.menu-left.hide .close {
	display: block;
}
.menu-left.hide li span,
.menu-left .close,
.menu-left.hide .open,
.menu-left.hide .pa {
	display: none;
}
.content {
	transition: 0.2s all;
}
.content.full {
	width: calc(100% - 70px);
}
.content.full table {
	width: 100% !important;
}
.menu-left {
	background: #F2F2F2;
	height: calc(100vh - 85px);
	padding: 0px 15px;
	color: #9b9b9b;
	width: 250px;
	position: fixed;
	top: 85px;
	z-index: 2;
	transition: 0.2s all;
}
.menu-left.sticky {
	height: 100vh;
	top: 0px;
}
.menu-left ul {
	font-size: 16px;
}
.menu-left li a {
	padding: 10px 5px 10px 5px;
	display: block;
	width: 250px;
}
.menu-left li.active {
	color: rgb(64, 64, 64);
	font-weight: 700;
}
.menu-left a:hover,
.menu-left .hide a:hover {
	color: rgb(64, 64, 64);
}
.menu-left .title {
	text-transform: uppercase;
	margin: 25px 0px 15px 0px;
}
.menu-left .title.pa {
	margin: 15px 0px;
}
.menu-left ul i {
	font-size: 30px;
	vertical-align: middle;
	width: 40px;
}
.menu-left .toogle-menu {
	cursor: pointer;
	position: absolute;
	bottom: 0px;
	text-align: center;
	left: 0px;
	text-transform: uppercase;
	text-align: center;
	width: 100%;
	border-top: 1px solid #dbdbdb;
}
.menu-left .toogle-menu div {
	padding: 13px 0px;
}
/*MENU*/

/*HOME*/
#home .employee {
	padding-right: 15px;
}
#home .last-cars {
	padding-left: 15px;
}
#home .employee li, #home .last-cars li, #home .important li {
	padding: 20px;
	background: #F7F7F7;
	margin-bottom: 10px;
	position: relative;
}
#home .employee span {
	width: 22px;
	height: 22px;
	float: right;
	border-radius: 100%;
	margin-top: -4px;
}
#home span.status {
	width: auto;
	padding: 7px 6px;
	position: absolute;
	right: 10px;
	top: 13px;
}
#home .last-cars a:hover li {
	background: #F2F1F1;
}
#home .important span.note {
	background: white;
	padding: 10px 10px;
	font-size: 13px;
	font-style: italic;
	border-radius: 5px;
	position: relative;
	display: block;
	margin-top: 20px;
	line-height: 1.4;
}
#home .important li {
	background: #ffeaea;
}
#home .important span.note:before {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid white;
	top: -10px;
	left: 12px;
}
#home .important a:hover li {
	background: #fbd8d8;
}
/*HOME*/

/*CONTENT*/
.container.login {
	margin: 50px auto 0px auto;
	width: 40%;
}
.content {
	width: calc(100% - 250px);
	float: right;
	padding: 30px;
}
.content a.back {
	font-size: 25px;
	margin-left: -5px;
	display: inline-block;
	vertical-align: top;
}
.content a.back:hover {
	color: #fea000;
}
.info-top {
	margin-bottom: 30px;
}
.info-top .g60 {
	font-weight: normal;
	font-size: 24px;
}
.info-top .g40 {
	text-align: right;
}
.box h2 {
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 20px;
}
span.online {
	background: RGBA(99, 199, 33, 0.5);
}
span.offline {
	background: RGBA(255, 25, 25, 0.5);
}
/*CONTENT*/

/*****************CSS SONETS*****************/
html, button, body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,
kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,legend,table,caption,tbody,tfoot,thead,
tr,th,td {margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent}body{line-height:1}
ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-clapse:clapse;border-spacing:0}
small {font-size: 11px;}
img{max-width:100%;}
p:last-child {margin-bottom: 0px;}
p:first-child {margin-top:0px;}
a, a:link, a:visited{
	text-decoration:none;
    color: inherit;
}
p {
	line-height:1.5;
	margin: 15px 0px;
}
/*grids and cumns*/
.row {
	display: inline-block;
	vertical-align: middle;
	width: 100%;
}
.g10 {width: 10%;}
.g15 {width: 15%;}
.g20, .c5 {width: 20%;}
.g25, .c4 {width: 25%;}
.g30 {width: 30%;}
.c3 {width: 33.33333%;}
.g35 {width: 35%;}
.g40 {width: 40%;}
.g45 {width: 45%;}
.g50, .c2 {width: 50%;}
.g55 {width: 55%;}
.g60 {width: 60%;}
.g65 {width: 65%;}
.g70 {width: 70%;}
.g75 {width: 75%;}
.g80 {width: 80%;}
.g85 {width: 85%;}
.g90 {width: 90%;}
.c6 {width: 16.6%}
.g10, .g15, .g20, .g25, .g30, .g35, .g40, .g45,
.g50, .g55, .g60, .g65, .g70, .g75, .g80, .g85, .g90,
.c5, .c4, .c3, .c2, .c6 {
	float:left;
	box-sizing: border-box;
}
/*other*/
strong {font-weight: 700;}
.sonets img {
	padding-left: 1px;
	margin-top: -2px;
	vertical-align: middle;
}
.sonets a:hover img {
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-o-transform:rotate(360deg);
}
a, i, .opacity, .btn, li, .files .shadow {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
 }
.zoom:hover {
	transform: scale(1.05);
}
.opacity {opacity: 1;}
.opacity:hover {opacity: 0.7;}
.rotate:hover {transform:rotate(360deg);}
.alignright {float: right;}
img.alignright {margin: 5px 0px 1em 1em;}
.alignleft {float: left;}
img.alignleft {margin: 0 1em 1em 0;}
.aligncenter {display: block; margin-left: auto; margin-right: auto;}
/*****************CSS SONETS*****************/

/*RWD*/
@media only screen and (max-width: 1350px){
	.container {
		width: 95%;
	}
}
/*RWD*/