MIJ 2.0 CSS + scripts

13.9.2020

.navigation-buttons a[data-target="cart"] {color: #000 !important;}
.navigation-in > ul > li:hover > a {color: #e3032d;}
.navigation-in ul li a b {font-weight: 300;text-transform: lowercase;}

#header {margin-top:25px;}
#header > .container {width: calc(100vw - 50px); padding: 0 25px;}

.content-wrapper-in {max-width: calc(100vw - 50px); margin: auto;}

@media (max-width: 480px) {
#header {margin-top:10px;}
.content-wrapper-in {max-width: calc(100vw - 20px); margin: auto;}
#header > .container {width: calc(100vw - 20px); padding: 0 25px;}
.navigation-buttons {margin-top: 10px;margin-right:10px;}
}
@media (max-width: 768px) {

}

@media (min-width: 768px) and (max-width: 992px) {
.navigation-buttons {margin-top: 25px;margin-right:25px;}
.navigation-window-visible .navigation-buttons {margin-right: 25px;}
.navigation-window-visible #navigation {margin-right: 25px;padding-top: 85px;}
}
@media (min-width: 992px) {
.navigation-buttons {margin-top: -25px;}
.navigation-buttons a {
background-color: transparent !important;
border-color: transparent !important;
width: 80px;
padding-top: 25px;
height: 105px;
line-height: 80px;
}
}

.navigation-buttons a:hover {background-color: #222 !important; color: #fff !important;}
.navigation-window-visible .navigation-buttons a[data-target="navigation"] {color: #fff; background-color: #222222;}

.banners-content.body-banners, .shp-tabs-row.responsive-nav {display: none;}
.banners-row {margin-left: 0px; margin-right: 0px;}
body.in-index .content {padding-left: 0; padding-right: 0;}
.index-content-wrapper {max-width: 100%;}
.homepage-texts-wrapper>div {margin: 0;}
</style>

<style>

/* Hodnoceni post-it */

body.in-hodnoceni-obchodu #content-wrapper {width: 100%;max-width: 1418px;margin:auto;}
body.in-hodnoceni-obchodu .content-inner > div > .vote-wrap {margin-top: 50px;}
.content-inner > .votes-wrap {display: flex; flex-wrap: wrap; justify-content: space-between;}
@media (max-width: 768px) {
.votes-wrap > .vote-wrap {width:100%;}
}
@media (min-width: 768px) and (max-width: 992px) {
.votes-wrap > .vote-wrap {width:50%;min-width: 360px;}
}

@media (min-width: 992px) {
.votes-wrap > .vote-wrap {width:30%;min-width: 360px;}
}

.vote-content {
margin: auto;
padding: 30px;
padding-bottom:80px;
background: #bacdb0;
width: 300px;
height: auto;
box-shadow: 3px 3px 3px 3px #0000001f;
position: relative;
}

.vote-content:after {
content: "";
position: absolute;
bottom: -2em;
left: 0;
right: 2em;
border-width: 1em;
border-style: solid;
border-color: #bacdb0;
}
.vote-content:before {
content: "";
position: absolute;
bottom: -2em;
right: 0;
border-width: 2em 2em 0 0;
border-style: solid;
border-color: #96ac8a transparent;
}

.votes-wrap > .vote-wrap:nth-child(odd) .votes-wrap.admin-response .vote-content {
-webkit-transform:rotate(8deg);
-o-transform:rotate(8deg);
-moz-transform:rotate(8deg);
}
.votes-wrap:not(.admin-response) > .vote-wrap:nth-child(even) > .vote-header + .vote-content,
.votes-wrap > .vote-wrap:nth-child(5n) .votes-wrap.admin-response .vote-content {
-webkit-transform:rotate(4deg);
-o-transform:rotate(4deg);
-moz-transform:rotate(4deg);
}
.votes-wrap:not(.admin-response) > .vote-wrap:nth-child(3n) > .vote-header + .vote-content,
.votes-wrap > .vote-wrap:nth-child(even) .votes-wrap.admin-response .vote-content {
-webkit-transform:rotate(-3deg);
-o-transform:rotate(-3deg);
-moz-transform:rotate(-3deg);
}
.votes-wrap:not(.admin-response) > .vote-wrap:nth-child(5n) > .vote-header + .vote-content,
.votes-wrap > .vote-wrap:nth-child(3n) .votes-wrap.admin-response .vote-content {
-webkit-transform:rotate(5deg);
-o-transform:rotate(5deg);
-moz-transform:rotate(5deg);
}

.votes-wrap.admin-response .vote-wrap { position: relative; top: -100px;}
.votes-wrap.admin-response .vote-header {display: none;}
.vote-wrap {border-color: transparent;}
.votes-wrap.admin-response .vote-content {background-color: #ffc4d1; height: auto; padding-bottom: 30px;}
.votes-wrap.admin-response .vote-content:after {border-color: #ffc4d1;}
.votes-wrap.admin-response .vote-content:before {border-color: #e39fae transparent;}

</style>