HTML { overflow-y:scroll; width:100% }
BODY { padding:0; margin:0; width:100%; font-family:"News Cycle", Arial; font-size:1rem; line-height:1.5; letter-spacing:0.3px; }
H1 { color:#666; margin-bottom:20px; font-size:16pt; text-transform:uppercase }
H2 { color:#666; font-size:14pt; text-transform:uppercase }
H3 { color:#666; font-size:1em; text-transform:uppercase; margin:5px }
INPUT, SELECT, button { border:1px solid #aaa; padding-left:5px; background:white; font-family:"News Cycle", "Archivo Narrow", Abel, Arial; font-size:1em; line-height:1.5; letter-spacing:0.3px; }
A { text-decoration:none; color:#ff6600 }

.page { width:1400px; margin-left:auto; margin-right:auto }


.header { display:flex; justify-content:space-between; align-items:center; font-size:1.2em; color:white; background: #4471ff; }
.header A { color:white }
.header A:hover { color:#fc0 }
.header DIV { padding:10px 20px; }
.header DIV I { margin-right:5px }
.header IMG { xpadding:10px }
.header-right { flex:1; text-align:right }
.header-lang { text-align:right; padding-right:20px; xmargin-bottom:20px; }

.content { display:flex; justify-content:center; align-items:center; }

.login { display:flex; align-items:center; margin-bottom:20px }
.login-left { width:150px }
.login-right { width:150px }
.login-error { color:#d00; margin-bottom:20px }

.user { display:grid; grid-template-columns:minmax(120px, 200px) minmax(300px, 500px); grid-template-rows:auto; gap:20px 20px; grid-template-areas:". ."; }
.user INPUT[type="text"], .user INPUT[type="password"] { min-width:300px; }

.users-login { display:grid; grid-template-columns:minmax(120px, 200px) minmax(300px, 500px); grid-template-rows:auto; gap:0px; grid-template-areas:". ."; }
.users-login DIV { padding:3px; cursor:default } 



/* AJAX page */
#ajaxpage { position:fixed; top: 50%; left: 50%; z-index: 20000; padding:15px; text-align:left; background:#fff; color:black; display:none; -webkit-box-shadow: -4px 4px 16px 0px rgba(0,0,0,0.62); -moz-box-shadow: -4px 4px 16px 0px rgba(0,0,0,0.62); box-shadow: -4px 4px 16px 0px rgba(0,0,0,0.62); -moz-border-radius:10px; border-radius: 10px; }
#ajaxpage-close { float:right; cursor:pointer }
#page-cover { display: none; position: fixed; width: 100%; height: 100%; background-color: #000; z-index: 9999; top: 0; left: 0; }
#page-cover-load { display: none; position: fixed; width: 100%; height: 100%; background:#000; z-index: 9999; top: 0; left: 0; }
#page-cover-preloader { display: none; position: fixed; width: 20%; z-index: 20000; top: 50%; left: 50%; margin-top: -10%; margin-left: -10%; background:#4471ff; padding:0px 20px; text-align:center; font-size:1.2em; color:white }

.hidden { display:none }

.button { border:none; padding:3px 20px; text-transform:uppercase; color:white; }
.buttonmid { border:none; padding:4px 20px; text-transform:uppercase; color:white; }
.buttonsmall { border:none; border:1px solid #999; padding-left:10px; padding-right:10px; text-transform:uppercase; color:white; font-size:0.9em }
.buttonVybava { user-select:none; border:none; border:1px solid #999; padding-left:5px; padding-right:5px; font-size:0.8em }
.buttonDetails, .buttonProdane { user-select:none; border:none; border:1px solid #999; padding-left:5px; padding-right:5px; font-size:0.8em; background:#fe6 }
.button:hover, .buttonmid:hover, .buttonsmall:hover { color:#eee; xopacity:0.9 }
.grey { background:#999; }
.orange { background:#ff6600; border:1px solid orange }
.orange-text { color:#ff6600; }
.blue { background:#4471ff;  border:1px solid #69d }
.blue-text { background:#4471ff; }
.hidden { display:none }
.orangelight { background:#ffece0; border:1px solid #ff6600; }
.bluelight { background:#e1e8ff; border:1px solid #4471ff; }
.greenlight { background:#ccffbb; border:1px solid #59b300; }
.btnSelect { width:100px;}
.red { background:#d00;  border:1px solid #a00 }


.cars-offer { max-width:1400px; cursor:default; display:grid; 		grid-template-columns:30px 140px 100px minmax(auto, 450px) 	120px 130px 120px 240px; grid-template-rows:auto; gap:0px 0px; grid-template-areas:". ."; }
.cars-offer-my { max-width:1400px; cursor:default; display:grid; 	grid-template-columns:30px 140px 100px auto 			120px 130px 120px 120px 180px; grid-template-rows:auto; gap:0px 0px; grid-template-areas:". ."; }

.cars-offer-admin { max-width:1400px; cursor:default; display:grid; 	grid-template-columns:30px 130px 90px minmax(auto, 450px) 	120px 60px 100px 120px 150px 150px; grid-template-rows:auto; gap:0px 0px; grid-template-areas:". ."; }
.car-detail-left { grid-column: auto / span 3 }
.car-detail-center { grid-column: auto / span 3 }
.car-detail-right { grid-column: auto / span 4 }


.cars-offer DIV, .cars-offer-admin DIV, .cars-offer-my DIV { padding:5px; }

.car-offer-order { border-radius:50%; width:15px; height:15px; padding:0px; margin-top:5px; background:#fff; border: 1px solid #666; text-align: center; line-height:0.9em }
.car-offer-order-1 { background:#C9B037 }
.car-offer-order-2 { background:#D7D7D7 }
.car-offer-order-3 { background:#AD8A56 }

.cars-header { display: contents; }
.cars-header > div { color:white; background:#444; }

.cars-wrap { display:contents; }
.cars-wrap:nth-child(2n) > div { background:#e5e5e5 }
.cars-wrap:hover > div { background-color:#fe6; }

.cars-filter { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:10px; justify-content:flex-start }
.cars-filter DIV { cursor:pointer }
.cars-filter DIV:hover { background:#ddd }
.cars-filter DIV.orange:hover { background:orange }

.car-selected { font-weight:bold }
.car-detail { padding:0 }
.car-equipment { display:flex; padding:0px; margin:0px; xbackground:red; gap:10px; justify-content:flex-start; align-content:flex-start }
.car-equipment DIV { padding:0; margin:0 }
.car-detail-toggle { cursor:pointer }

.price-show { padding:0 }
.price-edit { padding:0 }
.price-edit INPUT { width:100px }
.price-updated { background:lightgreen }
.price-history { cursor:pointer; padding:0 }
#price-history { width:500px; border:1px solid #aaa; background:#fff; z-index:1000; position:absolute; }

.white { color:white }



.mobile-show { display:none }
.mobile-hide { display:block }


@media only screen and (min-width: 1200px)
{
}

@media only screen and (min-width: 800px)
{
}	

@media only screen and (max-width: 800px)
{
}