/* thx to http://www.colorzilla.com/gradient-editor/ */

body {
	font-family:arial;
	font-size:18px;
	margin:0;
	padding:0;
	text-align:center;
}

a:link, a:active, a:visited, a:hover {
	color:black;
	font-style:italic;
}

ul {
	margin:0 10px;
	padding-left:15px;
}

li {
	padding-top:10px;
	text-align:justify;
}

button {
	margin:5px auto 0;
	font-size:16px;
}

fieldset {
	border:1px solid #ccc;
}

input {
	font-size:18px;
	width:200px;
	line-height:32px;
	height:32px;
	padding: 0 10px;
}

textarea {
	font-size:18px;
	width:200px;
	height:100px;
	padding:0 15px;
}

/* TABS */

.header {
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:50px;
	background:linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
	background-size:100% 50px;
	overflow:hidden;
}
.header p {
	display:inline-block;
	line-height:46px;
	color:white;
	margin:0;
	padding:0;
}
.overflow {
	position:absolute;
	top:50px;
	left:0;
	right:0;
	bottom:0;
	overflow:auto;
	background-image:url('body.png');
	background-attachment:fixed;
}
.tab {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	padding:0;
	background:linear-gradient(135deg, #e6f0a3 0%,#d2e638 50%,#c3d825 51%,#dbf043 100%);
	z-index:-3;
	text-align:center;
}

/* TABS Z-INDEX */

#tab_cars_list {
	z-index:+1;
}
#tab_car_sel {
	z-index:+2;
}
#tab_car_editor, #tab_photos_list, #tab_fills_list, #tab_repairs_list, #tab_insurances_list {
	z-index:+3;
}
#tab_photo_editor, #tab_fill_editor, #tab_repair_editor, #tab_insurance_editor {
	z-index:+4;
}
#tab_stats {
	z-index:+5;
}
#tab_log {
	z-index:+50;
}
#tab_spinner_bg {
	background:#aaa;
	opacity:0.5;
	z-index:+100;
}
#tab_spinner {
	background:transparent;
	opacity:1;
	z-index:+101;
}

/* SPINNER */

.spinner_circle {
  width:80px;
  height:80px;
  border-radius:60px;
  box-sizing:border-box;
  border:10px solid rgba(255, 255, 255, 0.2);
  border-top-color:#FFF;
	padding:0;
	margin:0;
  animation:spinner 2s infinite linear;
}
.spinner_container {
	margin-top:50px;
	position:relative;
	display:inline-block;
	width:80px;
	height:80px;
}
@keyframes spinner {
	from { transform:rotate(0deg); }
	to { transform:rotate(360deg); }
}

/* BUTTONS */

span.rounded {
	display:inline-block;
	min-width:32px;
	margin:5px 2px;
	border:2px solid #ccc;
	border-radius:16px;
	padding:0 5px;
	line-height:32px;
	background-color:#fff;
	height:34px;
	vertical-align:middle;
}
span.circle {
	display:inline-block;
	min-width:26px;
	margin:5px 2px;
	border-radius:32px;
	padding:0 5px;
	line-height:36px;
	height:36px;
	vertical-align:middle;
}

li.selected, span.selected, .selected  {
	border-color:darkblue;
}

/* LOG */

#log {
	margin-left:8px;
}
#log > p {
	margin:0;
	padding-top:10px;
	padding-bottom:10px;
	border-bottom:1px dashed #000;
}

.info {
}
.warn {
}
.error {
	font-weight:bold;
}

/* TABLES */

table {
	margin:0 auto;
}

th, td {
	padding:4px;
}

table.list, table.list2 {
	width:100%;
	border-collapse:collapse;
	margin:10px 0;
}
table.list img {
	vertical-align:middle;
	margin:5px 0;
}
table.list thead tr th,table.list2 thead tr th  {
	background:black;
	color:white;
	font-weight:normal;
	line-height:20px;
}
table.list tbody tr, table.list2 tbody tr {
	line-height:30px;	
}

table.list tbody tr:nth-child(even) {
	background:lightgrey;
}
table.list tbody tr:nth-child(odd) {
	background:linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
}
table.list tbody tr.sel {
	background:linear-gradient(to bottom, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
}

table.list2 tbody tr:nth-child(4n), table.list2 tbody tr:nth-child(4n-1) {
	background:lightgrey;
}
table.list2 tbody tr:nth-child(4n-2), table.list2 tbody tr:nth-child(4n-3) {
	background:#f0f0f0;
}

/* ICONS */

/* with white bg */
.button_add {
	background:#fff url('plus.png') no-repeat center center;
}
.button_del {
	background:#fff url('delete.png') no-repeat center center;
}
.button_settings {
	background:#fff url('menu.png') no-repeat center center;
}
.button_edit {
	background:#fff url('edit.png') no-repeat center center;
}
.button_submit {
	background:#fff url('submit.png') no-repeat center center;
}
.button_back {
	background:#fff url('backward.png') no-repeat center center;
}
#main_import {
	background:#fff url('upload.png') no-repeat center center;
}
#main_export {
	background:#fff url('download.png') no-repeat center center;
}

/* with gray bg */
.button_gas {
	background:#666 url('gas-station.png') no-repeat center center;
}
.button_repair {
	background:#666 url('oil.png') no-repeat center center;
}
.button_insurance {
	background:#666 url('umbrella.png') no-repeat center center;
}
.button_stats {
	background:#666 url('stats.png') no-repeat center center;
}
.button_camera {
	background:#666 url('camera.png') no-repeat center center;
}

/* CAR ROW */
div.car {
	display:inline-block;
	text-align:middle;
}
div.row p {
/*
	font-weight:bold;
*/
	line-height:20px;
}

/* IMG */

img.icon {
	vertical-align:middle;
	padding:5px 10px 5px 0
}

img.pict {
	vertical-align:middle;
	margin:10px 0;
	padding:10px;
	max-width:240px;
	max-height:180px;
	background:white;
	border:1px solid #ccc;
	box-shadow:2px 2px 5px rgb(120,120,120);
}

img.s160x120 {
	max-width:160px;
	max-height:120px;
}

/* OTHERS */

p.italic {
	font-style:italic;
}
div.absright {
	position:absolute;
	right:0;
}
div.absleft {
	position:absolute;
	left:0;
}
.left {
	text-align:left;
}

div.frame {
	position:relative;
	margin:10px;
}

div.frame_bg {
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:#fff;
	opacity:0.5;
	border-radius:10px;
	z-index:-1;
}

div.frame_fg {
	opacity:1;
	padding:10px;
}

td.currency, td.volume {
}

.description {
	color:#808080;
}