@import "products.css";
@import "carts.css";
@import "orders.css";

/* R E S E T */

html, 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, 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, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0; 
  padding: 0; 
  border: 0; 
  font-size: 100%; 
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; 
}
blockquote, q {
  quotes: none; 
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: ''; 
  content: none; 
}
table {
  border-collapse: collapse; 
  border-spacing: 0; 
}
ins {text-decoration: none !important;}
img, table, iframe {max-width: 100%;}
ul, li {list-style: none;}

/**/

.green {color: #22aa22;}
.red {color: #aa2222;}
.blue {color: #2222aa;}
.yellow {color: #ff9900;}


/* R E P O R T S */

p.success, p.caution, p.failure, p.advice, p.empty, p.notice {
  font-weight: bold;
  padding: 10px;
  text-align: center;
	clear: both;
	font-size: 1.2rem;
	margin-bottom: 2rem;
	width: 100%;
	box-sizing: border-box;
}
p.success {
  background: #ccffcc;
  border: #bbeebb 1px solid;
  color: #009900;
}
p.caution {
  background: #ffffcc;
  border: #ddddaa 1px solid;
  color: #cc9900;
}
p.failure {
  background: #ffddcc;
  border: #eeccbb 1px solid;
  color: #ee0000;
}
p.advice {
  background: #ccddff;
  border: #bbccee 1px solid;
  color: #0066cc;
}
p.empty {border: #cccccc 1px solid; 
	margin: 3rem 0; 	
	float: left;
	width: 100%;
}
p.notice {
  background: #ffddaa;
  border: #ff9933 1px solid;
  color: #dd7700;
}
	

/* D E S K T O P */ 

.desktop {
	background: #f3f3f3;
	box-shadow: 0 0 10px rgba(0,0,0,0.3);
	position: fixed;
	top: 0;
	z-index: 98;
	width: 100%;
	text-align: center;
}	
.desktop__area {padding: 0 20px;}
@media screen and (max-width: 1024px) {
	.desktop__area  {color: #f3f3f3;}
}
@media screen and (min-width: 1025px) {
	.desktop__area  {color: #000;}
}
.desktop__margin {
	margin-top: 4rem;
}		
		.desktop__account {
			background-image: url('icons/admin-account.png');
		}
		.desktop__manager {
			background-image: url('icons/admin-manager.png');
		}
		.desktop__signout {
			background-image: url('icons/admin-signout.png');
		}
		.desktop__browse {
			background-image: url('icons/admin-browse.png');
		}
		.desktop__orders {
			background-image: url('icons/admin-orders.png');
		}		
		.desktop__item {
			display: inline-block;
			text-decoration: none;
			background-repeat: no-repeat;
			width: auto;
			position: relative; 
			margin: 0;
		}
@media screen and (max-width: 479px) {
		.desktop__item {	
			background-position: center 15px;
			text-indent: -9999px;
			width: 50px;
			height: 50px;
			margin: 0 5px;
		}
}
@media screen and (min-width: 480px) and (max-width: 1024px) {
		.desktop__item  {
			background-position: center 15px;
			padding: 40px 10px 0 10px;
		}
}
@media screen and (min-width: 1025px) {
		.desktop__item {	
			background-position: 20px center;
			padding: 20px 20px 20px 52px;
		}
		.desktop__item:first-child {
			margin-left: -20px;
		}
		.desktop__item:hover {text-decoration: underline;}
}	


/* F O R M S */

.main form.form {width: 100%; margin-bottom: 20px; padding: 20px 0 0 0; position: relative; float: left;} /* vsechny editacni formulare */ 
.main form.tabs {padding-top: 80px; background: #f3f3f3; } /* editacni formular se zalozkami (editace modulu) */

/* Tabs */

ul.tabs {background: #fff; font-size: 1rem; margin: 0 0 20px 0; width: 100%; float: left; border-bottom: 1px solid #ccc;} /* blok se zalozkami na vypisech a v editacnim formulari */
.form ul.tabs {position: absolute; top: 0; border: 0;} /* blok se zalozkami v editacnim formulari */
ul.tabs li {background: #fff; float: left; margin: 5px 5px 0 0;} /* jednotlive zalozky */
ul.tabs a {text-decoration: none; color: #000;} /* odkazy v zalozkach */
.form ul.tabs li {background: #ccc;}
.form ul.tabs li.active  {background: #f3f3f3;} /* aktivni zalozka v editacnim formulari */
ul.tabs li.active {background: #ccc;} /* aktivni zalozka */
ul.tabs li a, ul.tabs li span {padding: 5px 10px; display: inline-block;} /*  */

.form table {width: 100%;} /* tabulky ve formulářích */ 
.formtab, .formsubmit {padding: 0 20px; margin-bottom: 20px;} /* divy ve formulari; formtab vsude, formsubmit jen u fomrulare se zalozkami */ 
.formtab {} /* div obsahujici pole pro editaci; krome formulare se zalozkami obsahuje i submit */ 
 /* samostatny div obsahujiic submit ve formulari se zalozkami */

input, select, textarea, button {padding: 2px 5px; box-sizing: border-box;}
/*input, select, textarea {border-width: 1px; border-style: solid;}*/ 
 
.label {text-align: right; width: 40%; vertical-align: top;} /* td obsahujici popisek pole */
.input {padding: 5px;} /* td obsahujici inputy, selecty, vcetne submitu */
label {display: inline-block; }
.label label {margin-top: 6px;}
input {border: 1px solid #ccc;}
input.submit {padding: 5px 40px;}
input.short, select.short {width: 60px;}
input.medium, select.medium {width: 110px;}
input.long, select.long {width: 250px;}
input.browse {width: 230px; margin-right: 5px;}
select {margin-right: 5px;}
a.browse {background: url('icons/browse.png') no-repeat; cursor: pointer; display: inline-block; height: 16px; width: 16px; text-indent: -9999px;}
select.day, select.hour, select.minute {width: 60px;}
select.month {width: 110px;}
select.year {width: 70px;}
textarea {width: 100%;}
#mw_tr_addresskind .label {padding-top: 5px}

.required, .oneof {font-weight: bold; font-size: 125%;}
.required {color: #cc0000;}
.oneof {color: #0066cc;}
tr.error {color: #ee0000;}
tr.error input, tr.error select {background: #ffeeee; border: #ee0000 1px solid;}
span.error {display: block; font-size: 90%;}

.mce-tinymce {width: 100% !important; /*max-width: 640px;*/ border-color: #ccc !important; margin: 0 auto 1em auto;}
.mce-tinymce iframe {min-height: 400px !important;}
.mce-fullscreen iframe {height: 90vh !important;}


/* Help */

img.help  {margin: 0 3px; position: relative; top: -4px; width: 10px; height: 10px;}
img.info, 
img.caut  {position: relative; bottom: -6px; left: -3px; width: 16px; height: 16px;}


/* A D M I N T A B L E */

/*table.admin a.download, table.admin a.install, table.admin a.uninstall {margin: 5px 0; padding: 5px 10px;}*/
p.options {float: right; clear: both; margin-top: 10px;}
table.admin {background: #fff; border-left: #d2d2d2 1px solid; border-top: #d2d2d2 1px solid; width: 100%; 	margin: 30px 0;}
table.admin th {background: #d2d2d2; text-align: center;}
table.admin th, table.admin td {border-bottom: #d2d2d2 1px solid; border-right: #d2d2d2 1px solid; padding: 5px;}
table.admin td.image {width: 110px;}	
table.admin td.general, td.move, td.options {white-space: nowrap;}
table.admin .list td:first-child {padding-left: 20px;}
table.admin .list td:first-child:before {content: '•'; margin-right: 5px;}
table.admin .deleted, table.admin .rejected {color: #888; font-style: italic;}
table.admin .waiting {background: #eee; font-weight: bold;}
table.admin .failed {background: #ffddcc;	color: #ee0000;}
table.admin .succesful {background: #ccffcc; color: #009900;}
table.admin .cautionary {background: #ffffcc; color: #cc9900;}
table .id {width: 33px;}
td.move div, td.options div {float: right;}
td.move a, td.options a {float: left;}
td.move {width: 47px;} /* td.move width = poÄŤet ikonek*(a width + a margin-right) + a margin-right napĹ™. 47=2*(16+5)+5 */
td.move a.up {margin-right: 25px;}
td.move a.down {margin-left: -21px;}
th.options1 {width: 26px;} /* th.options width = poÄŤet ikonek*(a width + a margin-right) + a margin-right napĹ™. 26=1*(16+5)+5 */
th.options2 {width: 47px;}
th.options3 {width: 68px;}
th.options4 {width: 89px;}
th.options5 {width: 110px;}
th.options6 {width: 131px;}
th.options7 {width: 152px;}
th.options8 {width: 173px;}
th.options9 {width: 194px;}
th.options10 {width: 215px;}

td.general {text-align: center;}
td.number, .right {text-align: right;}
td.text, .left {text-align: left;}
img.captcha {position: relative; top: 7px; left: 5px;}
img.usergroup_icon {position: relative; top: 2px; height: 16px; width: 16px;}

.options a, .move a  {display: inline-block; margin-right: 5px; text-indent: -9999px; width: 16px; height: 16px; background: no-repeat center;}
.options a.up, .move a.up {background-image: url('icons/up.png');}
.options a.down, .move a.down {background-image: url('icons/down.png');} 
.options a.add {background-image: url('icons/add.png');}
.options a.preview {background-image: url('icons/preview.png');}
.options a.view {background-image: url('icons/view.png');}
.options a.edit{background-image: url('icons/edit.png');}
.options a.copy {background-image: url('icons/copy.png');}
.options a.delete {background-image: url('icons/delete.png');}
.options a.remove {background-image: url('icons/delete.png');}
.options a.place {background-image: url('icons/download.png');}
.options a.restore {background-image: url('icons/restore.png');}
.options a.erase {background-image: url('icons/erase.png');}
.options a.reject {background-image: url('icons/reject.png');}
.options a.approve {background-image: url('icons/approve.png');}
.options a.send {background-image: url('icons/send.png');}
.options a.setting {background-image: url('icons/setting.png');}
.options a.attachment {background-image: url('icons/attachment.png');}
.options a.repeat {background-image: url('icons/repeat.png');}
.options a.complete {background-image: url('icons/approve.png');}
.options a.money {background-image: url('icons/money.png');}

p.viewpass, p.viewpassx {}

p.add {text-align: right; width: 100%; float: left;}
p.add, p.empty, p.require {clear: both;}
p.add a /*, p.require a, table.admin a.download, table.admin a.install, table.admin a.uninstall */{
/*p.require = modul zpÄ›tnĂˇ vazba - odkaz zaĹľĂˇdat o zpÄ›tnou vazbu*/
  background: #4CAF50;
  display: inline-block;
  padding: 5px 40px;
  margin-bottom: 20px;
  text-decoration: none;
	color: #fff;
}    
p.add a:hover/*, p.require a:hover, table.admin a.download:hover, table.admin a.install:hover, table.admin a.uninstall:hover*/ {background: #999999; color: #ffffff;}


.colored {color: #ffff00; font-style: italic; font-weight: bold; text-shadow: 0 0 2px #000;}
.backcolored {background: #ffff00; color: #000; padding: 0 3px;}

table.bordered td {border-width: 1px; border-style: solid;}
table.grid, table.sgrid  {border: none;}
table.sbordered, table.sgrid  {width: 100%;}

.content {clear: both;}
.content ul li {list-style: disc;}
.content ol li {list-style: decimal;}


.lfloat {float: left; margin: 0 1em 1em 0;}
.rfloat {float: right; margin: 0 0 1em 1em;}


.view {float: right; clear: both;}

.publication, 
.author,
.edited, 
.editor {font-size: 75%; color: #888;}
.author a, 
.editor a {text-decoration: none;}
.author a:hover, 
.editor a:hover {text-decoration: underline;}

.paging {clear: both; text-align: center; width: 100%;}
.paging a {margin: 0 2px;}
.paging span.active {font-weight: bold; margin: 0 2px;}

.links  {clear: both; text-align: right;}


/* LIST, VIEW, RESULT */

.module_list, 
.module_view,
.module_result {position: relative; float: left; box-sizing: border-box; clear: both;}

.module_list, 
.module_view,
.article_result, 
.contact_result,
.feedback_result, 
.job_result,
.page_result,
.reference_result, 
.search_result {position: relative; float: left; width: 100%; box-sizing: border-box; clear: both;} /* resulty na 100% sirky  */

.product_result {position: relative; float: left; box-sizing: border-box;} /* resulty na mene nez 100% sirky  */


.article_result, 
.contact_result,
.feedback_result, 
.job_result,
.page_result,
.reference_result, 
.search_result {border-bottom: 1px solid #ccc; margin-bottom: 30px; padding-bottom: 30px;}

.preferred {background: #f3f3f3; padding: 1em; border: none;}

/* Pictures */

div.picture {
	box-sizing: border-box;
	position: relative;
	float: left;
	overflow: hidden;
}
/*.picture img, */img {/*width: auto;*/ height: auto;}
 

.article_result .picture, 
.contact_result .picture,
.feedback_result .picture,
.job_result .picture,
.page_result .picture,
.reference_result .picture,
.search_result .picture {
	overflow: hidden;
	width: 10rem;
	margin-right: 1rem;
	/*{width: 170px; float: left; margin: 0 15px 15px 0;}*/
}
.article_result .picture {
	float: left;
	width: 10rem;
	height: 6.25rem;
	margin-right: 1rem;
}
.contact_result .picture {
	width: 10rem;
	height: 12.857142857rem;
	margin-right: 1rem;
}
.feedback_result .picture {
	width: 10rem;
	height: 6.25rem;
	margin-right: 1rem;
}
.job_result .picture {
	float: left;
	width: 10rem;
	height: 6.25rem;
	margin-right: 1rem;
}
.page_result .picture {
	float: left;
	width: 10rem;
	height: 6.25rem;
	margin-right: 1rem;
}
.reference_result .picture {
	float: left;
	width: 10rem;
	height: 6.25rem;
	margin-right: 1rem;
}
.search_result .picture {
	float: left;
	width: 10rem;
	height: 6.25rem;
	margin-right: 1rem;
}
.article_result .picture img, 
.contact_result .picture img,
.feedback_result .picture img,
.job_result .picture img,
.page_result .picture img, 
.reference_result .picture img,
.search_result .picture img {
	min-height: 100%;
	max-height: 200%;
	min-width: 100%;
	max-width: 200%;
	position: absolute;
	left: 50%;
	top: 50%;
	-ms-transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	/*{width: 100%;}*/
}

.article_view .picture, 
.contact_view .picture,
.feedback_view .picture,
.job_view .picture,
.page_view .picture,
.reference_view .picture {
	overflow: hidden;
	width: 10rem;
	height: auto;
	margin-right: 1rem;
	margin-bottom: 1rem;
	/*{width: 170px; float: left; margin: 0 15px 15px 0;}*/
}


div.gallery, div.images {margin: 1em 0;}
div.gallery div.image, div.images div.image {float: left; margin: 0.5%;}
div.gallery a, div.images a {margin: 0.5%;}
div.gallery img, div.images img {border: 1px solid #eee; height: 130px; padding: 2px; width: auto;}

/* C O O K I E S */

.cookies, #cookies_close {background: rgba(50,50,50,0.7); color: #fff; position: fixed; text-align: center;}
.cookies a.cookies_agree, #cookies_close a {background: #fff; color: #333; cursor: pointer; display: inline-block; font-weight: bold; text-decoration: none; padding: 3px 8px;}
.cookies a {color: #fff;}
.cookies {width: 100%; bottom: 0; padding: 30px 3% 10px 3%; z-index: 99; box-sizing: border-box;}
.cookies p {float: left; font-size: 0.8em; z-index: 1;}
.cookies a.cookies_agree {margin-left: 10px;}
.cookies a.close {background: url('../common/icons/cookies_close.png') no-repeat center; background-size: 20px; cursor: pointer; display: block; position: absolute; right: 10px; top: 10px; width: 20px; height: 20px; z-index: 2;}
#cookies_close {margin: 0; padding: 5%; width: 50%; left: 25%; top: 20%; z-index: 1; box-sizing: border-box;}
#cookies_close a {margin-top: 20px;}
@media screen and (max-width: 640px) {
#cookies_close {width: 90%; left: 5%;}
}
@media screen and (min-width: 1025px) {
.cookies {padding-top: 10px;}
}



/*div.filter, div.selection {
  border-bottom: #cccccc 1px solid;
  border-top: #cccccc 1px solid;
  clear: left;
  margin: 0 0 10px 0;
}
div.filter select, div.selection select {
  margin-bottom: 7px;
  margin-top: 7px;
}*/

/*p.note {} 
p.tip {}
p.warning{}
p.gallery {}*/

/*table.admin td.image img, table.admin img {
	max-width: 50px; 
	max-height: 50px; 
}
th.options_2, th.options_3, th.options_4 {
  width: 200px;
}*/

/* O T H E R */
/*h2 {
  clear: both;
  margin: 15px 0;
}
h3, h4 {clear: both;}

img, table, iframe {max-width: 100%;}
.mapa img {max-width: none;}
ins {text-decoration: none !important;}*/

/* RATING */

/*div.rating5 {width: 100%; clear: both; float: left; position: relative; z-index: 100;}
p.rated, p.average, p.rating, p.rate {float: left; margin-right: 20px;}
p.rating span, p.reviews_rating span {display: inline-block; width: 20px; height: 20px;}
p.rating span.grade1off, p.rating span.grade2off, p.rating span.grade3off, p.rating span.grade4off, p.rating span.grade5off, p.rating span.grade6off, p.rating span.grade7off, p.rating span.grade8off, p.rating span.grade9off, p.rating span.grade10off {background: #eee;}
p.rating span.grade1on, p.rating span.grade2on, p.rating span.grade3on, p.rating span.grade4on, p.rating span.grade5on, p.rating span.grade6on, p.rating span.grade7on, p.rating span.grade8on, p.rating span.grade9on, p.rating span.grade10on {background: #ccc;}
p.rate {position: relative; float: left; margin-top: 5px;}
p.rate span {position: absolute; padding: 10px;}
p.rate span.enter {z-index: 2; cursor: pointer; text-decoration: underline;}
p.rate span.enter:hover{color: #000;}
span#ratescale {background: #fff; border: 1px solid #ccc; float: left; z-index: 1; padding: 40px 20px 20px 20px;}
span#ratescale a {display: block; height: 20px; width: 200px; margin: 10px 0;}
span#ratescale a span {display: none; position: relative; padding: 0;}
span#ratescale a.rate1 {background: #eee;}
span#ratescale a.rate2 {background: #ddd;}
span#ratescale a.rate3 {background: #ccc;}
span#ratescale a.rate4 {background: #bbb;}
span#ratescale a.rate5 {background: #aaa;}
span#ratescale a.rate6 {background: #999;}
span#ratescale a.rate7 {background: #888;}
span#ratescale a.rate8 {background: #777;}
span#ratescale a.rate9 {background: #666;}
span#ratescale a.rate10 {background: #555;}*/

/* PRICE FILTER */

/*form.price_filter {width: 100%; position: relative;}
form.price_filter input {width: 30px;}
form.price_bar label {display: none;}
form.price_bar input {border: none; width: 30px; position: absolute;}
form.price_bar input#price_from {left: 0;}
form.price_bar input#price_to {right: 60px;}
form.price_bar button {position: absolute; right: 0; width: 40px;}
form.price_bar div#price_bar {width: 75%; background: #000; height: 20px; margin: 0 70px 0 40px; position: relative;}
form.price_bar div#price_bar div#pricebar_from , form.price_bar div#price_bar div#pricebar_top {position: absolute; top: 0; width: 30px; height: 30px;}
form.price_bar div#price_bar div#pricebar_from {background: #ff0000;}
form.price_bar div#price_bar div#pricebar_top {background: #00ff00;}*/

/* COMMENTS, SOCIAL NETWORKS */
/*div.like {clear: both; float: left; margin: 20px 0;}  
.fb, div.pinterest, div.foursquare, div.foursquare a {display: inline-block !important;}              
div.fblike, div.gplus, div.twitter, div.linkedin, div.tumblr, div.pinterest, div.foursquare, div.yelp {float: left; margin: 10px 15px 0 0 !important;}
#___plusone_0, .twitter-share-button  {margin: 0 -30px 0 0 !important;}
div.fblike {margin-top: 10px !important;}
*/
