body {
	background-color: #f5f5f5;
	color: #000000;
	padding: 0;
	margin: 0;
	font: 14px/21px "HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
}

body.bgmoto #top-box { background-image: url('/img/ban_moto.jpg'); }
body.bgcar #top-box { background-image: url('/img/ban_auto.jpg'); }
body.bgbike #top-box { background-image: url('/img/ban_kolo.jpg'); }
body.bgship #top-box { background-image: url('/img/ban_kajak.jpg'); }
body.bgplane #top-box { background-image: url('/img/bgplane.jpg'); }
body.bgwheel #top-box { background-image: url('/img/bgwheel.jpg'); }
body.bgdap #top-box { background-image: url('/img/ban_vzv2.jpg'); }
body.bgcam #top-box { background-image: url('/img/ban_cam.jpg'); }
body.bgsonar #top-box { background-image: url('/img/ban_sonar.jpg'); }
body.bgforklift #top-box { background-image: url('/img/ban_vzv2.jpg'); }
body.bglaptop #top-box { background-image: url('/img/ban_notebook.jpg'); }
body.bgpalubni #top-box { background-image: url('/img/ban_palubni.jpg'); }
body.bgprint #top-box { background-image: url('/img/ban_tiskarny.jpg'); }
body.bgtough #top-box { background-image: url('/img/ban_tough_claw.jpg'); }
body.bgtoughtrack #top-box { background-image: url('/img/ban_tough_track.jpg'); }
body.bggds #top-box {background-image: url('/img/ban_gds.jpg');}
body.bgagri #top-box {background-image: url('/img/ban_agriculture.jpg');}

a { color: #000000; }

hr {
	border: 0;
	height: 1px;
	background: #333;
	background-image: linear-gradient(to right, #ccc, #333, #ccc);
}

noscript#ns-info { text-align: center; display: block; background-color: #BB0000; z-index: 100; position: relative; padding: 3px; font-weight: bold; }

#top-stripe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 360px;
	background: #2e2e2e url('/img/bg_top.jpg') center center no-repeat;
	z-index: 2;
	-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.35);
	box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.35);
}

#top-wrapper {
	width: 1050px;
	height: 360px;
	position: relative;
	margin: auto;
}

#top-box {
	width: 1050px;
	height: 295px;
	position: absolute;
	bottom: 0px;
	background-repeat: no-repeat;
	background-position: center center;
	margin: auto;
	background-image: url('/img/ban_moto.jpg');
	-webkit-box-shadow: 0px -3px 5px 2px rgba(0,0,0,0.35);
	-moz-box-shadow: 0px -3px 5px 2px rgba(0,0,0,0.35);
	box-shadow: 0px -3px 5px 2px rgba(0,0,0,0.35);
}

body.homepage #top-box {
	height: 35px;
	background: #fff;
}

body.homepage #top-wrapper {
	height: 100px;
}

body.homepage #top-stripe {
	height: 100px;
}

body.homepage #main {
	margin-top: 100px;
}

#head {
	position: absolute;
	top: 0px;
	left: 50%;
	margin-left: -525px;
	width: 1050px;
	height: 65px;
}

#top-box .uvod {
	font-weight: bold;
	text-align: justify;
	width: 400px;
	position: absolute;
	bottom: 10px;
	left: 15px;
	background-color: rgba(255,255,255,.9);
	color: #111;
	padding: 5px;
	font-size: 15px;
}

#top-box .uvod a { color: #000; }

#main { margin: 360px auto 0px auto; width: 1050px; _border: 1px solid #FF0000; z-index: 1; position: relative; }
#mia { float: right; }
h1 { text-transform: uppercase; font-size: 36px; font-weight: bold; font-stretch: condensed; line-height: 100%; text-shadow: 0 0 4px #000000; padding-left: 10px; color: #fff; }
h1.small { font-size: 28px; }
#menu-wrapper { width: 100%; height: 35px; background: rgba(0,0,0,.75); position: absolute; top: 0px; left: 0px; }
#menu { font-weight: bold; line-height: 35px; text-align: center; }
#menu a { margin-left: 10px; color: #fff; }
#cart { float: right; font-weight: bold; margin: 6px 16px 0 0; color: #fff; }
#cart:hover { color: #FF7700; }
#cart .count { margin-left: 5px; float: right; border-radius:16px; border: 1px solid #FFFFFF; width:20px; height: 21px; text-align: center; }
#cart.full .count { background-color: #FF7700; }
#cart.full:hover .count { background-color: #FFFFFF; }
#left-menu { float: left; width: 250px; background-color: #dedede; padding: 10px 0px;}
#left-menu a { text-decoration: none; font-weight: bold; display: block; color: #000; }
#left-menu a:hover { color: #FF7700 }
#left-menu ul { padding: 0 5px 0 5px; margin: 5px 0 0 0; }
#left-menu ul li { padding: 0 10px; list-style: none inside none; line-height: 200%; border-bottom: 1px solid #666666; }
.lmenu-head { background-color: #373737; color: #ff7700; padding: 5px; font-weight: bold; text-transform: uppercase; }

#vyhledavani { width: 300px; position: absolute; top: 15px; left: 420px; }
#vyhl-box { padding: 4px; font-size: 14px; width: 200px; border: 1px solid #FFFFFF; }
#vyhl-lupa { position: relative; top: 8px; left: -4px; border: 1px solid #FFFFFF; padding: 2px; }
#vyhl-plne { text-align: center; color: #000000; padding: 10px; margin: 10px; background: #99CCFF; }

#breadcrumb { font-size: 12px; color: #000; padding: 2px;}
#breadcrumb a { color: #000; }

#content { width: 800px; float: right; background-color: #fff; }
#content div.ct { margin-top: 15px; padding: 20px; background-color: #FFFFFF; color: #000000; clear: both; position: relative; }
#content div.ct a { color: #000000; }
#content p { text-align: justify; margin: 0; }

#konfigurator-iframe {
	width: 795px;
	height: 2000px;
	border: 0px;
}

#recenze {width: 125px; right: -145px; top: 25px; position: absolute; color: #ffffff; background-color: rgba(0,0,0,0.5); padding: 5px;}
#recenze h2 {text-align: center; font-size: 14px;}
#recenze p {font-size: 12px}
#recenze .autor {text-align: right; font-size: 12px;}

@media (max-width: 1366px) {
	#recenze {
		display: none;
	}
}

#k-plus { font-weight: bold; font-size: 50px; position: absolute; top: 40px; left: 0; width: 100%; text-align: center; }
#k-drzak, #k-uchyt { font-size: 40px; font-weight: bold; color: #0099DD; text-align: right; width: 42%; float: left; line-height: 80%; }
#k-drzak span, #k-uchyt span { font-size: 22px; display: block; }
#k-uchyt { color: #FF7800; text-align: left; float: right; }

#ram-kontakt {
  text-align: center;
  padding: 10px 0;
  font-size: 14px;
  font-weight: bold;
  clear: both;
}

#footer {  color: #000; margin-top: 30px; padding: 5px; font-size: 12px; text-align: center; clear: both; padding-left: 230px;}
#footer a {color: #000}

.form { margin: 10px 78px; float: left; float: left; }
.form-head { font-size: 16px; font-weight: bold; }
.form select { width: 220px; margin: 10px 0; padding: 3px 5px; font-size: 14px; }

#moto-vyrobce, #moto-model, #moto-rok, #drzak-typ { border: 1px solid #FF7800; }
#zar-vyrobce, #zar-model { border: 1px solid #0099DD; }

#results { margin-top: 20px; border-right: 1px solid #FF7800; border-left: 1px solid #0099DD; }
.subresults { clear: both; padding: 20px 0; }

.sr-header { padding: 5px 10px; background-color: #0099DD; color: #FFFFFF; font-weight: bold; 
	background-image: -moz-linear-gradient(center left , #0099DD 45%, #FF7800 55%);
	background-image: linear-gradient(left, #0099DD 45%, #FF7800 55%);
	background-image: -o-linear-gradient(left, #0099DD 45%, #FF7800 55%);
	background-image: -webkit-linear-gradient(left, #0099DD 45%, #FF7800 55%);
} 
.closeline { height: 1px; 
	background-image: -moz-linear-gradient(center left , #0099DD 45%, #FF7800 55%);
	background-image: linear-gradient(left, #0099DD 45%, #FF7800 55%);
	background-image: -o-linear-gradient(left, #0099DD 45%, #FF7800 55%);
	background-image: -webkit-linear-gradient(left, #0099DD 45%, #FF7800 55%);
}
.sr-left { width: 370px; float: left; _border: 1px solid #00FFFF; }
.sr-right { width: 370px; float: right; _border: 1px solid #00FF00;}
#results .product { padding: 10px; min-height: 90px; }
#results .product .p-info { float: right; text-align: right; }
#results .product img { float: left; background-color: #FFFFFF; padding: 5px; }
#results .product .p-nazev { font-size: 12px; }
#results .product .p-skladem { font-weight: bold; color: #00CC00; margin-bottom: 10px; }
#results .product .p-cena { color: #FF7800; font-weight: bold; font-size: 16px; margin-bottom: 10px; }
#results .product .kosik { border: 1px solid #FF0000; background-color: #FF6600; margin: 10px 0 0 15px; padding: 5px 15px; font-weight: bold; color: #FFFFFF; text-decoration: none; font-size: 13px;  }
#results .product .kosik.jetam { border: 1px solid #00CC00; background-color: #33CC00;  }

#produkt .rightbox { float: right; width: 400px; }
#produkt .rightbox img { max-width: 100% !important; }
#produkt #cena { font-weight: bold; color: #FF7800; font-size: 20px; margin-bottom: 20px; }
#produkt table { margin-bottom: 20px; }
#produkt table td { padding-right: 50px; }
#produkt #obrazky { float: left; width: 330px; }
#produkt #obr-hlavni { margin-bottom: 20px; }
#produkt .obr-nahled { padding: 4px; cursor: pointer; }
#produkt .vid-nahled { width: 100px; height: 100px; display: inline-block; position: relative; cursor: pointer; padding: 4px; vertical-align: bottom; }
#produkt .vid-nahled img.play { position: absolute; top: 50%; left: 50%; margin-top: -26px; margin-left: -26px; }
#produkt .vid-nahled .thumb-wrapper { position: relative; width: 100%; height: 100%; background: #fff; }
#produkt .vid-nahled .thumb { width: 100px; height: 100px; }
#produkt .obr-nahled.vybran, #produkt .vid-nahled.vybran { background-color: #FFCCCC; }

#produkt #video-player, #produkt #youtube-player {width: 330px; height: 330px; padding-bottom: 20px;}

.skladem { font-weight: bold; color: #00AA33; }

#cart-line a#cart-add { cursor: pointer; width: 180px; font-size: 16px; font-weight: bold; padding: 10px 30px; background-color: #00AA33; color: #FFFFFF; text-decoration: none; }
#cart-line { text-align: center; padding: 10px 0; margin-bottom: 20px; }


#user-panel { background-color: #000000; z-index: 10; position: absolute; top: 0; color: #fff; }
#user-panel a { color: #fff; }

#fb-likes { border: 0 none; overflow: hidden; padding: 30px 0px; position: relative; width: 240px; margin: 0px 10px; }
#fb-likes .pluginConnectTextDark { display: none; }

.products { padding: 10px; background-color: #FFFFFF; position: relative; color: #000000;}
.products h2 { color: #000000; }
.products a { color: #000000; }
.p-tile { float: left; width: 240px; padding: 20px 10px; text-align: center; background-color: #FFFFFF; height: 320px; }
.p-tile.small { width: 165px; }
.p-tile img { background-color: #FFFFFF; padding: 10px; margin-bottom: 10px; }
.p-tile .p-name { font-size: 12px; text-align: left; display: block;}
.p-tile .p-price { font-size: 15px; color: #FF7800; font-weight: bold; float: right; }
.p-tile .skladem { float: left; }

.tc { text-align: center; }
.tl { text-align: left; }
.tr { text-align: right; }
.fl { float: left; }
.fr { float: right; }
.cl { display: block; clear: both; }
.invisible { display: none; }

.msg { padding: 10px; text-align: center; font-weight: bold; margin: 10px 0;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}
.msg.err { border: 1px solid #FF6666; background: #FFE3D6; color: #DD0000; }
.msg.ok { border: 1px solid #AAEEAA; background: #E3FFE3; color: #00BB00;}

#main-videa {
	padding-top: 20px;
	clear: both;
}

#main-videa .main-video {
	margin: 0px 24px;
}

#ram-groups {
	width: 688px;
	margin: 0px auto;
}

#drzak-bottom, #rameno-bottom { padding: 10px; margin: 0 32px; width: 260px; float: left; text-align: justify; color: #FFFFFF; height: 250px;
	-moz-border-radius-bottomRight: 16px;
	-webkit-border-bottom-right-radius: 16px;
	border-bottom-right-radius: 16px;
	-moz-border-radius-bottomLeft: 16px;
	-webkit-border-bottom-left-radius: 16px;
	border-bottom-left-radius: 16px;
	font-size: 12px;
	line-height: 15px;
}
#drzak-bottom p, #rameno-bottom p { margin-top: 10px; }
#drzak-bottom {
	background-color: #0099DD;
	background-image: linear-gradient(top, #0099DD 0%, #0066CC 100%);
	background-image: -moz-linear-gradient(top, #0099DD 0%, #0066CC 100%);
	background-image: -o-linear-gradient(top, #0099DD 0%, #0066CC 100%);
	background-image: -webkit-linear-gradient(top, #0099DD 0%, #0066CC 100%);
}
#rameno-bottom {
	background-color: #FF7800;
	background-image: linear-gradient(top, #FF7800 0%, #DD6600 100%);
	background-image: -moz-linear-gradient(top, #FF7800 0%, #DD6600 100%);
	background-image: -o-linear-gradient(top, #FF7800 0%, #DD6600 100%);
	background-image: -webkit-linear-gradient(top, #FF7800 0%, #DD6600 100%);}

#konfigurator-groups {width: 780px; margin: 20px 0px;}
#konfigurator-groups h2 {color: #FF7800; text-transform: uppercase; text-align: center;}
#konfigurator-groups .konfigurator-dlazdice {display: block; float: left; width: 140px; height: 140px; margin: 7px; padding-top: 5px;}
#konfigurator-groups .konfigurator-dlazdice:hover {
	-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);}
#konfigurator-groups .konfigurator-dlazdice a {position: relative; width: 140px; height: 140px; text-decoration: none; font-weight: bold; display: block; color: #0099DD;}
#konfigurator-groups .konfigurator-dlazdice a span {position: absolute; bottom: 5px; width: 140px; height: 42px; text-decoration: none; font-weight: bold; text-align: center;}

#cookie-bar {
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(33,86,142);
    background: linear-gradient(97deg, rgba(33,86,142,1) 5%, rgba(20,117,219,1) 100%);
    z-index: 20000000000;
    color: #ffffff;
    font-size: 14px;
    line-height: 20px;
    max-height: 100%;
    overflow: auto;
    padding: 0 10px;
    box-sizing: border-box;
}

#cookie-bar h2 {
    font-size: 20px;
    margin-bottom: 15px;
    color: #ffffff;
}

#cookie-bar a {
    color: #ffffff;
    text-decoration: underline;
}

#cookie-bar p {
    margin-bottom: 5px;
    color: #ffffff;
}

#cookie-bar .cookie-bar-inner {
    margin: 30px auto 10px auto;
    display: flex;
    max-width: 1170px;
}

#cookie-bar .cookie-bar-content {
    flex-grow: 1;
    text-align: left;
    padding-right: 10%;
}

#cookie-bar .cookie-bar-controls {
    text-align: center;
}

#cookie-bar .cookie-bar-customize {
    display: none;
}

#cookie-bar.extended .cookie-bar-summary {
    display: none;
}

#cookie-bar.extended .cookie-bar-customize {
    display: block;
}

#cookie-bar .cookie-bar-controls > span {
    display: block;
    cursor: pointer;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    color: #ffffff;
    font-size: 15px;
    font-weight: bold;
    padding: 15px;
    text-decoration: none;
    width: 185px;
    margin: 10px auto;
    text-align: center;
    line-height: 20px;
}

#cookie-bar #cookies-allow {
    background: #1DB51D;
}

#cookie-bar #cookies-customize {
    background: #fcfcfc;
    color: #555555;
}

#cookie-bar.extended #cookies-customize {
    display: none;
}

#cookie-bar #cookies-submit-customized {
    display: none;
    background: #fcfcfc;
    color: #555555;
}

#cookie-bar.extended #cookies-submit-customized {
    display: block;
}

#cookie-bar #cookies-decline {
    font-weight: normal;
    text-decoration: underline;
}

#cookie-bar .cookie-type-block {
    margin-bottom: 10px;
    padding-left: 20px;
}

#cookie-bar .cookie-title {
    display: flex;
    align-items: center;
}

#cookie-bar .cookie-title-name {
    font-size: 17px;
    font-weight: bold;
    flex-grow: 1;
    cursor: pointer;
    position: relative;
}

#cookie-bar .cookie-title-name::before {
    display: block;
    content: "";
    width: 5px;
    height: 5px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    position: absolute;
    left: -20px;
    top: 7px;
    transform: rotate(45deg);
}

#cookie-bar .cookie-type-block.expanded .cookie-title-name::before {
    transform: rotate(135deg);
    top: 5px;
}

#cookie-bar .cookie-type-block .cookie-description {
    display: none;
}

#cookie-bar .cookie-type-block.expanded .cookie-description {
    display: block;
}

.cookie-switch {
    --button-width: 3.5em;
    --button-height: 2em;
    --toggle-diameter: 1.5em;
    --button-toggle-offset: calc((var(--button-height) - var(--toggle-diameter)) / 2);
    --toggle-shadow-offset: 10px;
    --toggle-wider: 3em;
    --color-grey: #cccccc;
    --color-green: #4296f4;
}

.cookie-slider {
    display: inline-block;
    width: var(--button-width);
    height: var(--button-height);
    background-color: var(--color-grey);
    border-radius: calc(var(--button-height) / 2);
    position: relative;
    transition: 0.3s all ease-in-out;
    cursor: pointer;
}

.cookie-slider::after {
    content: "";
    display: inline-block;
    width: var(--toggle-diameter);
    height: var(--toggle-diameter);
    background-color: #fff;
    border-radius: calc(var(--toggle-diameter) / 2);
    position: absolute;
    top: var(--button-toggle-offset);
    transform: translateX(var(--button-toggle-offset));
    box-shadow: var(--toggle-shadow-offset) 0 calc(var(--toggle-shadow-offset) * 4) rgba(0, 0, 0, 0.1);
    transition: 0.3s all ease-in-out;
}

.cookie-switch input[type="checkbox"]:checked + .cookie-slider {
    background-color: var(--color-green);
}

.cookie-switch input[type="checkbox"]:disabled + .cookie-slider {
    opacity: 0.5;
}

.cookie-switch input[type="checkbox"]:checked + .cookie-slider::after {
    transform: translateX(calc(var(--button-width) - var(--toggle-diameter) - var(--button-toggle-offset)));
    box-shadow: calc(var(--toggle-shadow-offset) * -1) 0 calc(var(--toggle-shadow-offset) * 4) rgba(0, 0, 0, 0.1);
}

.cookie-switch input[type="checkbox"] {
    display: none;
}

.cookie-switch input[type="checkbox"]:active + .cookie-slider::after {
    width: var(--toggle-wider);
}

.cookie-switch input[type="checkbox"]:checked:active + .cookie-slider::after {
    transform: translateX(calc(var(--button-width) - var(--toggle-wider) - var(--button-toggle-offset)));
}

