/* PHONE */
@media only screen and (max-width: 600px) {
  .main-menu h2 {
    font-size: 14px;
  }
  .product-discount {
    font-size: 14px;
  }
  .product-price {
    font-size: 16px;
  }
  .lista ul {
    flex-flow: column wrap!important;
  }
  .lista li {
    border-bottom: 1px solid #555;
  }
}

/* TABLET */
@media only screen and (min-width: 600px) and (max-width: 1000px) {
  .main-menu h2 {
    font-size: 16px;
  }
  .product-discount {
    font-size: 20px;
  }
  .product-price {
    font-size: 20px;
  }
}

/* PHONE + TABLET */
@media only screen and (max-width: 1000px) {
  .burger { display: block; }
  .content {
    width: 100%;
  }
  .main-menu {
    height: 64px;
  }
  .main-menu nav {
    position: absolute;
    top: 64px;
    left: 0;
    overflow: hidden;
    max-height: 0;
    width: 100%;
    z-index: 3;
    transition: .8s;
    background: rgba(0, 51, 102, 0.95);
  }
  .main-menu nav li {
    margin: 8px 0;
  }
  #burger:checked ~ nav {
    height: auto;
    max-height: 100vh;
  }
  .main-menu a:hover {
    text-decoration: none;
    color: red;
  }
  .main-header {
    width: 100%;
    padding-top: 0px;
  }
  .product {
    flex-basis: 100%;
  }
}

/* DESKTOP */
@media only screen and (min-width: 1001px) {
  .burger { display: none; }
  .content {
    width: 1000px;
  }
  .main-menu {
    height: 44px;
  }
  .main-menu h2 {
    display: none;
  }
  .main-menu nav {
    width: 100%;
  }
  .main-menu nav ul {
    height: 44px;
    margin: 0 auto;
    width: 1000px;
    overflow: hidden;
    display: flex;
    flex-flow: row nowrap;
    white-space: nowrap;
  }
  .main-menu nav li {
    height: 36px;
    margin: 4px 0;
  }
  .main-menu nav a {
    font-weight: bold!important;
    font-size: 12px!important;
    font-family: 'Trebuchet MS'!important;
    display: flex;
    line-height: 36px;
    margin: 0px 4px;
    padding: 0 4px;
  }
  .main-menu nav a:hover {
    background: white;
    color: #003366;
  }
  .main-header {
    width: 1000px;
    padding-top: 0px;
  }
  .product-discount {
    font-size: 20px;
  }
  .product {
    flex-basis: 50%;
  }
  .product-price {
    font-size: 20px;
  }
}

.row {
  margin: 0!important;
}

.content {
  margin: 0 auto;
}

.content * {
  max-width: 100%;
}

.main-header {
  display: block;
  margin: 0 auto;
}

.main-menu {
  position: fixed;
  width: 100%;
  background: #003366;
  display: flex;
  font-family: Verdana;
  z-index: 10;
}

.main-menu h2 {
  color: white;
  align-self: center;
  margin-right: auto;
  margin-left: 32px;
  text-transform: uppercase;
}

.main-menu li {
  list-style: none;
}

.main-menu li a {
  text-decoration: none;
  text-transform: uppercase;
  color: white;
}

.burger span {
  position: absolute;
  width: 100%;
  height: 2px;
  display: block;
  background: white;
  transition: all .4s;
}

.burger span:nth-child(2) {
  margin-top: -1px;
  top: 50%;
}

.burger span:last-child {
  bottom: 0;
}

#burger:checked + label span {
  top: 50%;
  opacity: 0;
}

#burger:checked + label span:first-child {
  opacity: 1;
  transform: rotate(-405deg);
}

#burger:checked + label span:last-child {
  opacity: 1;
  transform: rotate(405deg);
}

.burger {
  width: 20px;
  height: 16px;
  cursor: pointer;
  position: relative;
  margin-right: 24px;
  align-self: center;
}

#burger { display: none; }

* {
  box-sizing: border-box;
}

.button {
  padding: 12px 24px;
  margin: 8px auto;
  display: inline-block;
}

.button, .button:hover {
  background: #00E676;
  text-decoration: none;
  color: white;
}

.button:hover {
  background: #00C853;
}

.product-section {
  display: flex;
  flex-flow: row wrap;
}

.product {
  max-width: 95vw;
  padding: 12px;
  box-sizing: border-box;
  margin: 0 auto;
}

.product-card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

.product-title {
  margin: 8px 3px;
  text-align: left;
}

.product-title a {
  text-decoration: none;
}

.product-img {
  width: 100%;
  display: block;
  padding-bottom: 49.6717724%;
  background-image: url(https://morezliav.sk/files/deal/5918/thumbs/damske-hodinky-talianskej-znacky-ops-objects-1-457x227.jpg);
  background-size: 100%;
  background-position: center;
  transition: all .08s;
}

.product-img:hover {
  background-size: 110%;
}

.product-info {
  background: #F5F5F5;
  display: flex;
  align-items: center;
  text-align: left;
}

.product-info a {
  text-decoration: none;
}

.product-time {
  padding: 0 16px;
  width: 45%;
}


.product-discount {
  margin-left: auto;
  color: #F44336;
  padding: 0 16px;
  font-weight: 600;
  width: 20%;
  text-align: right;
}

.product-discount:hover {
  text-decoration: none;
}

.product-price {
  color: white;
  padding: 8px 0;
  background: #00E676;
  width: 35%;
  text-align: center;
  transition: all .2s;
  text-decoration: none;
}

.product-price:hover {
  background: #00C853;
  text-decoration: none;
  color: white;
}

/* GLOBAL STYLES */
body,h1,h2,h3,h4,h5,h6,p,form,fieldset,img,ul{margin:0;padding:0;border:0;}
body,table{background-color:#fff;color:#2A2A2A;font-size:0.75em;font-family:Arial, Helvetica, sans-serif;}

body{padding:0;background:#fff url('img/bg.gif') repeat-x left top;text-align:center;}

.input, select, textarea{padding:2px;border-top:1px solid #cabfbf;border-right:1px solid #e7e4e4;border-bottom:1px solid #e7e4e4;border-left:1px solid #cabfbf;font:1em Arial, sans-serif;}
.submit{padding:5px 14px;border-width:1px;border-style:solid;border-color:#bbc9db #4d6991 #4d6991 #bbc9db;background:#6988b1;color:#fff;font:bold 1em Arial, sans-serif;}
.submit:hover{background:#859ec0;cursor:pointer;}
* html .submit{padding:3px 1px !important;}
* html .input{height:28px;}
.form{background:#f8f8f7;border:1px solid #eeecea;}
.form label{font-size:1em;color:#cc0000;font-weight:bold;}
.form table{background:#f8f8f7;}
.hide{display:none;}

a{background-color:inherit;color:#425a77;text-decoration:underline;}
a:hover{background:inherit;color:#cc0000;text-decoration:underline;}

.clear{clear:both;height:0px;font-size:0px;line-height:0px;}
.skiplink{position:absolute;top:-500px;left:0px;overflow:hidden;}
.left{text-align:left;}
.center{text-align:center;}
.right{text-align:right;}

#container{position:relative;width:100%;margin:0 auto;padding:0;}
#head1, #head2, #head3, #body, #foot{float:left;width:100%;margin:0 auto;padding:0;}
.container{width:1000px;margin:0 auto;text-align:left;}

/* HEADER WITH TOP MENU ABOVE LOGO 1 */

/* MENU TOP 1 */
#menu1{float:right;height:32px;margin-right:5px;list-style:none;}
#menu1 li{float:left;padding:6px 15px 0;list-style:none;}
#menu1 li a{float:left;padding:0;color:#fff;font:bold 1.083em 'Trebuchet MS';text-decoration:none;}
#menu1 li a:hover, #menu1 .selected a{text-decoration:underline;}

/* HEADER WITH TOP MENU ABOVE LOGO 2 */

/* MENU TOP 2 */
#head3{position:fixed;left:0;top:0px;background-color:#003366; z-index:2;}
#menu2{float:left;height:45px;margin:0;list-style:none;}
#menu2 li{float:left;padding:5px 5px 0;list-style:none;}
#menu2 li a{float:left;padding:10px 5px 12px;color:#FFFFFF;font:bold 1em 'Trebuchet MS';text-decoration:none;text-transform:uppercase;border-left:0px solid #f3f2f1;border-right:0px solid #f3f2f1;border-top:0px solid #f3f2f1;}
#menu2 li a:hover, #menu2 .selected a{border:0px solid #e6e3e3;border-bottom:0px;background-color:#fff;color:inherit;text-decoration:none;}

/* LOGO, HEADER BACKGROUND AND SLOGAN */
#head2{clear:both;margin-top:45px;}
#head2 .container{height:150px;background:url('img/header.png') no-repeat bottom right;}
#logo{padding: 25px 330px 0;}

/* NAVIGATION PATH - TREE */
#page h4{padding:2px 0 10px;color:#FF0000;background:inherit;font-size:1em;}
#page h4 a{background-color:inherit;color:#999999;text-decoration:none;font-weight:bold;}
#page h4 a:hover{text-decoration:underline;}
*:first-child+html #page h4{top:-5px;} /* IE 7 hack */
* html #page h4{top:-5px;} /* IE 6 hack */

/* BODY STYLES - LEFT AND RIGHT COLUMN */
#tip{padding: 0px 0px 0;float: center;}
#body{clear:both;margin:0;}
#body .container{overflow:hidden;background:#fff url('img/two_columns.gif') repeat-y 0px 10px;border-top:1px solid #C0C0C0;}

/* LEFT COLUMN STYLES */
#column{float:right;width:320px;padding:0px 0;}
#column .type{padding:10px 0;background:inherit;color:#003366;font:bold 1.25em arial;}
#hlavnahore{padding:15px 18px 0;}
#menu3{padding:0 20px 5px;}
#hlavna2{padding:15px 18px 0;}
#hlavna3{padding:15px 18px 0;}

/* LEFT MENU */
#menu3 ul, #menu4 ul{margin:4px 0;border-bottom:1px dashed #bcbaac;list-style:none;}
#menu3 a, #menu4 a{display:block;width:96%;padding:5px 2%;border-top:1px dashed #bcbaac;background:inherit;color:#553;text-decoration:none;}
#menu3 a:hover, #menu4 a:hover{background-color:#eeede8;color:#a7080c;text-decoration:underline;}

#menu3 .sub1, #menu4 .sub1{margin:0;border:0px none;; padding-left:0; padding-right:0; padding-top:0; padding-bottom:7px}
#menu3 .sub1 a, #menu4 .sub1 a{display:block;width:77%;border:0px none;background:url('img/circle.png') no-repeat 10px 8px; padding-left:13%; padding-right:10%; padding-top:2px; padding-bottom:2px}
#menu3 a:hover, #menu4 a:hover{background-color:#eeede8;}
#menu3 .selected, #menu4 .selected{background-color:#eeede8;color:#a7080c;text-decoration:underline;}

/* RIGHT COLUMN STYLES */
#content{float:left;width:680px;padding:10px 0 5px;text-align:center;}
* html #content{width:660px;}
#page{width:100%;margin:0 auto;text-align:left;}

#page h1{padding:10px 0 10px;background:inherit;color:#003366;font:bold 1.25em arial;text-align: left}
#page div.content{font:1.083em arial;}

#page div.content ul, .subpagesList li ol{margin:0 0 0 30px;padding:0;}
#page div.content li{margin:8px 0;padding:0;border-left:0;}

#page .tS{float:right;margin:0 0 3px;}
#page .tS div{display:inline;}
#page .tS a{padding:0 3px;background:inherit;color:#3d3d30;font-weight:bold;text-decoration:none;}
#page .tS a:hover{color:#cc0000;}
#page .tS0{font-size:0.917em;}
#page .tS1{font-size:1.083em;}
#page .tS2{font-size:1.333em;}

.pages{padding:8px 0;text-align:right;font-size:1.083em;}
.pages ul, .pages li{display:inline;}
.pages li{padding:0 2px;}
.pages a, .pages strong{padding:0 1px;font-size:1.083em;}

/* IMAGES STYLES */
.imagesList{list-style:none;}
.imagesList li{margin:0 0 15px 0;background:inherit;color:#5b5b5b;font-size:0.917em;text-align:center;}
.imagesList li img{border:2px solid #e6e3e3;}
.imagesList li div{text-align:center;}
.imagesList li img:hover{border-color:#d7d2d2;}

#imagesList1{float:left;margin:10px 20px 0 0;}
#imagesList2{clear:right;float:right;margin:10px 0 0 15px;}

/* FILES LIST STYLES */
#filesList{padding:10px 0 5px;list-style:none;vertical-align:middle;}
#filesList li{margin:0 0 6px;}
#filesList img{margin:0 8px 0 0;vertical-align:middle;}
#filesList em{padding-left:2px;background:inherit;color:#5b5b5b;}

/* SUB PAGES LIST STYLES */
.subpagesList{float:left;width:100%;margin:7px 0;list-style:none;}
.subpagesList li{clear:left;float:left;width:96%;margin:5px 0;padding:8px 2%;background:#F0F0F0;border-left:1px dashed #999999;}
* html .subpagesList li{width:100%;}
.subpagesList li .photo{float:left;margin:0 13px 5px 0;}
.subpagesList li img{border:2px solid #e6e3e3;}
.subpagesList li img:hover{border-color:#d7d2d2;}
.subpagesList li h2{padding-bottom:5px;}
.subpagesList li h2, .subpagesList li h2 a{background:inherit;color:#006600;font:bold 1.17em arial;text-decoration:none;}
.subpagesList li h2 a:hover{background:inherit;color:#cc0000;text-decoration:underline;}
.subpagesList li .description{font-weight:normal;font-size:1em;}
.subpagesList li ul, .subpagesList li ol{float:left;width:100%;margin:5px 0 0 30px;padding:0;}
.subpagesList li li{padding:0;border-left:0;}
.subpagesList li ul{list-style:disc;}
.subpagesList li ol{list-style:decimal;}

/* OPTIONS LINK */
#options{clear:both;float:right;width:100%;margin:10px 10px;background:inherit;color:#7f7f66;font-size:1em;text-align:right;}
#options a{padding:0 10px 0;}
#options .back, #options .print{float:right;}
#options .print a{border-left:1px solid #7f7f66;}

.message{padding:50px 0;text-align:center;}
.message h3{background:inherit;color:#cc0000;font:normal 2.58em serif;}

/* ADDITIONAL COLUMN */
#column2{display:none;float:right;width:100px;}

/* FOOTER - SITE AND SCRIPT COPYRIGHTS STYLES */
#foot{clear:both;padding:20px 0;border-top:1px solid #CCCCCC;background:#FFFFFF;color:#CCCCCC;font-size:1.083em;font-weight:bold;}
#foot .container{width:990px;margin:0 auto;}
#foot a{background:inherit;color:#CCCCCC;text-decoration:none;}
#foot a:hover{text-decoration:underline;}

#copy{float:left;padding:0 10px;}
.foot{float:right;padding:0 10px;}

@media print{
  * {color:#000 !important;background:#fff !important;border-color:#444 !important;border-width:1px !important;}
  #column, #head1, #head3{display:none;}
}

/* LISTA */
.lista {
  display: block;
  overflow: hidden;
  font: 15px normal Verdana, Arial, Helvetica, sans-serif;
}

.lista ul {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  font-size: 1.2em;
  background: linear-gradient(#383838, #191919);
  color: #202020;
  overflow: hidden;
  display: flex;
  flex-flow: row nowrap;
}

.lista li {
  padding: 0;
  border-right: 1px solid #555;
  flex-grow: 1;
  flex-shrink: 0;
}

.lista li:hover {
  background-color: #151d6d;
}

.lista li.active {
	background: linear-gradient(#920b0b, #810000);
}

.lista a, .lista a:focus, .lista a:active, .lista a:link {
  padding: 10px;
  display: block;
  color: #f0f0f0;
  text-decoration: none;
}