/*
font-family: 'Raleway', sans-serif;
light: 300;
regular: 400;
medium: 500;
semi-bold: 600;
bold: 700;
extra-bold: 800;
black: 900;
*/

/* 
font-family: 'Oxygen', sans-serif;
light: 300;
regular: 400;
bold: 700;
*/

/*
font-family: 'Epilogue', sans-serif;
light: 300;
regular: 400;
medium: 500;
semi-bold: 600;
bold: 700;
extra-bold: 800;
black: 900;
*/

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

html {
    position: relative;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body {
    font-family: 'Epilogue', sans-serif;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    line-height: 1.42857143;
    color: #333;
}
.container {
    max-width: 1290px;
    display: table;
    margin: 0 auto;
    position: relative;
}
.container.flex {
    display: flex;
    align-items: stretch;
}
.app-wrapper > .container {
    height: 100%;
}
#stripe1 {
    display: none;
}
body.withSidebar #stripe1 {
    display: block;
    width: 250px;
    float: left;
    padding: 30px 20px;
    box-sizing: border-box;
    background-color: #F4FDF0;
    margin-right: 40px;
}
.customHeader {
    display: none;
}
body.withSidebar .app-main {
    width: calc(100% - 290px);
    float: right;
}
.gridHolder {
    width: 100%;
    display: grid;
    margin: 0;
}
.six,
.three {
    float: left;
    padding: 0 15px;
    margin-bottom: 15px;
    box-sizing: border-box;
}
.six {
    width: 50%;
}
.three {
    width: 25%;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Epilogue', sans-serif;
    color: #10120F;
    margin: 50px 0 30px;
}

*:focus {
    outline: 0 !important;
}

a, a:hover, button, button:hover {
    transition: color .3s ease, background-color .3s ease, border-color .3s ease, box-shadow .3s ease, opacity .3s ease, -webkit-box-shadow .3s ease
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    color: #10120F;
    margin: 50px 0 30px;
}
h1 {
    font-size: 42px;
    font-weight: 700;
}
h2 {
    font-size: 26px;
    font-weight: 600;
}
h3 {
    font-size: 21px;
    font-weight: 600;
}
h4 {
    font-size: 18px;
    font-weight: 600;
}
h5 {
    font-size: 18px;
    font-weight: 600;
}
h6 {
    font-size: 16px;
    font-weight: 600;
}
a {  
    color: #8EEB67;
    text-decoration: none;
    cursor: pointer;
}

a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
    color: #10120F;
}

button {
    cursor: pointer;
    transition: all .3s ease;
}
button:hover {
    transition: all .3s ease;
}
button,
a.button,
input.button {
    font-size: 16px;
    color: #fff;
    font-weight: 700;
    line-height: 18px;
    padding: 11px 5px;
    min-width: 125px;
    text-align: center;
    display: table;
    background-color: #10120F;
    border: none;
}
button:hover,
a.button:hover {
    border: none;
    background-color: #91EB6B;
    color: #10120F;
}
button.green,
a.button.green,
input.button.green {
    background-color: #91EB6B;
    color: #10120F;
}
button.green:hover,
a.button.green:hover,
input.button.green:hover {
    background-color: #10120F;
    color: #fff;
}

:focus, :hover {
    outline: none;
    text-decoration: none;
}

::-moz-focus-inner {
    border: 0;
    outline: none;
}

:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 transparent;
}

::-moz-selection {
    color: #fff;
    background: #6E4C71;
}

::selection {
    color: #fff;
    background: #6E4C71;
}

@-moz-document url-prefix() {
    select, select:-moz-focusring, select::-moz-focus-inner {
        color: transparent !important;
        text-shadow: 0 0 0 #fff !important;
        background-image: none !important;
        border: 0;
    }
}

@media print {
    img {
        max-width: 100% !important;
    }
}

@media print {
    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }
}
.left {
    float: left;
}
.right {
    float: right;
}
.ta-center {
    text-align: center;
}
.ta-left {
    text-align: left;
}
.ta-right {
    text-align: right;
}

svg:not(:root) {
    overflow: hidden;
}

img {
    -ms-interpolation-mode: bicubic;
}

::-moz-selection {
    background: #55BC79;
    color: #fff;
}

::selection {
    background: #55BC79;
    color: #fff;
}
.red {
    color: #F03333;
}
label {
    font-weight: normal;
}

ul {
    list-style-type: none;
}

.app-wrapper {
    width: 100%;
    margin: 0 auto;
    overflow: auto;
    overflow-x: hidden;
    height: 100%;
    box-sizing: border-box;
    padding-top: 80px;
    min-height: calc(100vh - 190px);
    z-index: 9;
    position: relative;
}
.app-main {
    margin-bottom: 80px;
}
.homePage .app-main {
    margin-bottom: 40px;
}
.app-wrapper::before {
    content: '';
    display: table;
    clear: both;
}

.app-main {

}

.app-sidebar {

}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    transition: all .3s ease;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.app-header {
    width: 100%;
}
.headerTop {
    width: 100%;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#242523+0,333333+100 */
    background: rgb(36,37,35);
    background: -moz-linear-gradient(45deg,  rgba(36,37,35,1) 0%, rgba(51,51,51,1) 100%);
    background: -webkit-linear-gradient(45deg,  rgba(36,37,35,1) 0%,rgba(51,51,51,1) 100%);
    background: linear-gradient(45deg,  rgba(36,37,35,1) 0%,rgba(51,51,51,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#242523', endColorstr='#333333',GradientType=1 );
    position: relative;
    z-index: 9;
}
.burgerButton,
.responsiveSearch {
    display: none;

}
.app-brand {
    float: left;
    margin: 15px 0;
    transition: all .3s ease;
}
.logo {
    display: block;
    width: 50px;
    height: 50px;
    background-image: url("../img/Spinne-logozasajt.svg");
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all .3s ease;
}
.logo a {
    width: 100%;
    height: 100%;
    display: block;
}
h1.logo {
    margin: 0;
}
.app-nav {
    float: right;
    min-width: 1020px;
}
.headerBasket {
    float: right;
}
.app-nav nav {
    float: left;
}
.headerBasket {
    margin: 25px 0;
    display: table;
}
.cartIcon {
    min-width: 68px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    display: block;
    float: left;
    background-color: #121311;
    font-size: 14px;
}
.cartIcon i {
    color: #8EEB67;
}
.cartIcon span {
    color: #D1D1D1;
}
a.cart {
    min-width: 72px;
    float: left;
    text-align: center;
    height: 30px;
    font-weight: 700;
    font-size: 12px;
    line-height: 28px;
    color: #8EEB67;
    background-color: #121311;
    border: 1px solid #8EEB67;
}
a.cart:hover {
    color: #121311;
    background-color: #8EEB67;
}
.app-search {
    float: right;
    width: 160px;
    display: block;
}
.app-search .app-input {
    height: 24px;
    border: 1px solid #fff;
    background: #fff url('../img/Search.svg') center right 10px no-repeat;;
    line-height: 24px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    font-size: 12px;
    width: 100%;
    padding: 0 40px 0 20px;
    display: block;
}

/* SOCIAL NETWORKS */

.app-links {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.app-social {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
}

.networks {
    list-style-type: none;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0;
    margin-left: -15px;
    margin-right: -15px;
}

.networks .network-item {
    margin: 0 15px;
}

.networks .network-item .network-link {
    font-size: 18px;
    color: #000;
}

.networks .network-item .network-link:hover,
.networks .network-item .network-link:focus {
    color: #202020;
}


/* NAV */

.app-nav ul {
    list-style-type: none;
    display: table;
    margin: 20px 5px 0 15px;
    float: left;
    transition: all .3s ease;
}
.app-nav nav ul {
    margin-right: 40px;
}
.app-nav ul li {
    float: left;
}

.app-nav .navL1 {
    display: none;
}
.nav-link {
    font-size: 14px;
    line-height: 20px;
    padding: 10px 15px;
    /*    text-transform: uppercase;*/
    /*    color: rgba(255,255,255,0.7);*/
    color: #8EEB67;
    position: relative;
}
.nav-link:after {
    width: 6px;
    height: 6px;
    display: block;
    border-radius: 50%;
    opacity: 0;
    background-color: #8EEB67;
    position: absolute;
    content: "";
    bottom: 4px;
    left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    transition: all .3s ease;
}
.nav-link.current,
.nav-link.onPath,
.nav-link:hover,
.nav-link:focus {
    color: rgba(255,255,255,1);
}
.nav-link.current:after,
.nav-link:hover:after,
.nav-link.onPath:after,
.nav-link:focus:after {
    opacity: 1;
    transition: all .3s ease;
}
.headerBottom {
    background-color: #E4E4E4;
    position: relative;
    z-index: 7;
}

ul.logINNav {
    display: table;
    margin: 20px 20px 0 0;
    padding: 0;
    float: right;
    transition: all .3s ease;
}
ul.logINNav li {
    float: left;
}
ul.logINNav a {
    font-size: 13px;
    color: #fff;
    line-height: 16px;
    padding: 12px 20px;
    border-right: 1px solid #969696;
    display: block;
    font-weight: 500;
}
ul.logINNav a:hover {
    color: #8EEB67;
}
.app-nav li.hoverL1 .navL1 {
    display: block;
    background: rgb(36,37,35);
    background: -moz-linear-gradient(45deg, rgba(36,37,35,1) 0%, rgba(51,51,51,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(36,37,35,1) 0%,rgba(51,51,51,1) 100%);
    background: linear-gradient(45deg, rgba(36,37,35,1) 0%,rgba(51,51,51,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#242523', endColorstr='#333333',GradientType=1 );
    position: absolute;
    min-width: 150px;
    -webkit-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.3);
}
.app-nav .navL1 ul {
    margin: 5px 0;
}

/* PROFILE NAV */

.dropdown {
    float: left;
    position: relative;
    cursor: pointer;
}
.dropbtn {
    font-size: 14px;
    color: #fff;
    line-height: 12px;
    padding: 12px 20px;
    border-right: 1px solid #969696;
    display: block;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #8EEB67;
}
.dropbtn i {
    margin-left: 5px;
    color: #fff;
    transition: all 0.3s ease;
    position: relative;
}
.dropdown:hover .dropbtn i {
    color: #8EEB67;
    transition: all 0.3s ease;
    -webkit-transform: scaleY(-1);
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    transform: scaleY(-1);
}
.dropdown-content {
    display: none;
}
.dropdown:hover .dropdown-content {
    display: block;
    position: absolute;
    min-width: 150px;
    right: 0;
    top: 30px;
}
ul.logINNav .dropdown-content a {
    float: none;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
    background-color: #333;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    line-height: 16px;
    padding: 7px 20px;
    border: none;
    margin: 0;
    box-sizing: border-box;
}
ul.logINNav .dropdown-content a.active,
ul.logINNav .dropdown-content a:hover {
    background-color: #10120F;
    color: #8EEB67;
}
ul.logINNav .dropdown-content a.last {
    padding: 15px 20px;
    position: relative;
}
.dropdown-content a.last .icon {
    width: 16px;
    height: 16px;
    margin-right: 5px;
    background: url('../img/turn-off.svg') no-repeat center;
    background-size: contain;
    display: block;
    float: left;
}
.dropdown-content a.last:before {
    width: calc(100% - 40px);
    height: 1px;
    display: block;
    content: "";
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;
}
.logINNav li.desktop {
    display: block !important;
}
.logINNav li.mobile {
    display: none !important;
}
/* ASIDE */

aside {

}

/* FORMS */

.app-input {
    height: 30px;
    border: 1px solid #f5f5f5;
    padding: 5px 10px;
    background-color: #fff;
    color: #191919;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
}

.app-input:focus {
    border-color: #191919;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;

}

.app-input::placeholder {
    font-size: 14px;
    font-style: italic;
    font-weight: 400;
    color: #777;
}
.responsiveNav {
    display: none;
}

/* STICKY HEADER */

header.fixed {
    transition: all .3s ease;
    -webkit-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.3);
}

header.fixed .app-nav ul,
header.fixed ul.logINNav {
    margin-top: 5px;
    transition: all .3s ease;
}
header.fixed .app-nav ul.socialList {
    margin-top: 13px;
}
header.fixed .headerBasket {
    margin: 10px 0;
    transition: all .3s ease;
}
header.fixed .app-brand {
    transition: all .3s ease;
    margin: 5px 0;
}
header.fixed .logo {
    transition: all .3s ease;
    width: 164px;
    height: 40px;
}
/* FOOTER */

.footer {
    width: 100%;
    margin: 0 auto;
    background-color: #10120F;
    padding-top: 15px;
    min-height: 190px;
    box-sizing: border-box;
}
.footerLogo {
    width: 36px;
    height: 36px;
    float: left;
    background-image: url("../img/Spinne-logozasajt.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.footer-navigation {
    float: right;
}
footer ul {
    margin: 0;
}
footer ul li {
    float: left;
}
footer .nav-link {
    font-size: 14px;
    font-weight: 500;
    text-transform: none;
    color: #fff;
    line-height: 16px;
    padding: 10px 15px;
}
footer ul li:last-child .nav-link {
    padding-right: 0;
}
footer .nav-link::after {
    display: none;
}
footer .nav-link:hover {
    color: #8EEB67;
}
.footerBottom {
    width: 100%;
    display: table;
    clear: both;
    position: relative;
    /*    border-top: 1px solid #fff;*/
}
.footerBottom .container:before {
    width: calc(100% - 30px);
    height: 1px;
    background-color: rgba(255,255,255,0.4);
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 15px;
}
p.copy {
    color: #878887;
    font-size: 14px;
    text-align: center;
    margin: 10px 0 15px;
    padding: 0 300px;
    width: 100%;
    box-sizing: border-box;
}
footer .footer-sec-navigation {
    position: absolute;
    top: 13px;
    right: 15px;
}
footer .footer-sec-navigation ul {
    display: table;
}
footer .footer-sec-navigation .nav-link {
    color: #878887;
    border-right: 1px solid #878887;
    padding: 0 15px;
}
footer .footer-sec-navigation .nav-link:hover {
    color: #8EEB67;
}
footer .footer-sec-navigation li:last-child a.nav-link {
    border: none;
}
footer .container {
    position: relative;
}
.logos {
    display: table;
    background-color: #fff;
    position: absolute;
    right: 15px;
    bottom: 45px;
    text-align: center;
}
.logos img {
    display: inline-block;
    height: 26px;
    width: auto;
    margin: 5px;
}

/* ------------------------------ STORY INDEX ------------------------------- */

h1.page-title {
    font-size: 26px;
    font-weight: 800;
}
.gridStory {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 46px;
    grid-row-gap: 80px;
}
.storyImgContainer {
    position: relative;
    width: 100%;
}
.storyImgContainer .uptitle {
    display: block;
    text-transform: uppercase;
    font-weight: 700;
    color: #10120F;
    font-size: 9px;
    line-height: 20px;
    padding: 0 15px;
    display: inline-block;
    background-color: #8EEB67;
    position: absolute;
    top: 0;
    left: 0;
}
.storyNav .storyImgWrapper {
    margin-right: 0;
    width: 100%;
}
.storyImgContainer img {
    width: 100%;
    height: auto;
    display: block;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transition: all .3s ease;
}
a.storyList:hover .storyImgContainer img {
    -webkit-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    transition: all .3s ease;
}
.storyInfoWrapper .eventDate {
    margin-top: 15px;
    font-size: 16px;
    line-height: 1.2;
    color: rgba(0,0,0,0.5);
    display: block;
    text-transform: capitalize;
}
.storyInfoWrapper h5 {
    margin: 10px 0;
    text-decoration: none;
    transition: all .3s ease;
}
a.storyList:hover .storyInfoWrapper h5 {
    text-decoration: underline;
    transition: all .3s ease;
}
.storyInfoWrapper .lead {
    font-weight: normal;
    font-size: 16px;
    display: block;
    margin-bottom: 20px;
}
.storyInfoWrapper .button,
span.button,
.button {
    margin-top: 30px;
    font-size: 16px;
    color: #fff;
    font-weight: 700;
    line-height: 18px;
    padding: 11px 5px;
    min-width: 125px;
    text-align: center;
    display: table;
    background-color: #10120F;
    transition: all .3s ease;
    cursor: pointer;
}
.storyInfoWrapper .button {
    margin-top: 20px;
}
a.storyList:hover .storyInfoWrapper .button,
a:hover span.button,
.button:hover {
    background-color: #91EB6B;
    transition: all .3s ease;
    color: #10120F;
}
.button.fullWidth {
    width: 100%;
}
.pagination {
    width: 100%;
    display: table;
    clear: both;
    margin-top: 60px;
}
.pagination ul {
    display: table;
    margin: 0 auto;
}
.pagination ul li {
    float: left;
    margin: 0 3px;
    width: 30px;
    height: 30px;
    display: block;
    text-align: center;
    line-height: 30px;
    font-size: 12px;
    color: #10120F;
}
.pagination ul li.active {
    background-color: #88E062;
    font-weight: 600;
}
.pagination ul li.more {
    width: auto;
}
.pagination ul li a {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    background-color: rgba(209,209,209,0.25);
    font-weight: 400;
    color: #10120F;
}
.pagination ul li a:hover {
    background-color: #88E062;
    font-weight: 600;
}
.pagination ul li.next,
.pagination ul li.last,
.pagination ul li.first,
.pagination ul li.previous {
    background-color: rgba(209,209,209,0.25);
    transition: all .3s ease;
}
.pagination ul li.next:hover,
.pagination ul li.last:hover,
.pagination ul li.first:hover,
.pagination ul li.previous:hover {
    background-color: #88E062;
    transition: all .3s ease;
}
.pagination ul li.next a,
.pagination ul li.last a,
.pagination ul li.first a,
.pagination ul li.previous a {
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #10120F;
}
.pagination ul li.next a {
    -webkit-mask-image: url("../img/Arrow-right.svg");
    mask-image: url("../img/Arrow-right.svg");
}
.pagination ul li.previous a {
    -webkit-mask-image: url("../img/Arrow-right.svg");
    mask-image: url("../img/Arrow-right.svg");
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}
.pagination ul li.last a {
    -webkit-mask-image: url("../img/Arrow-right-2.svg");
    mask-image: url("../img/Arrow-right-2.svg");
}
.pagination ul li.first a {
    -webkit-mask-image: url("../img/Arrow-right-2.svg");
    mask-image: url("../img/Arrow-right-2.svg");
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}
a.storyList {
    display: table;
    width: 100%;
}

/* ---------------------------------- SINGLE STORY -------------------------- */

.smallerContainer {
    width: 100%;
    max-width: 1024px;
    margin: 0 auto;
    display: table;
}
.pageTop {
    margin: 20px 0 30px;
    width: 100%;
    display: table;
}
.bacToList {
    font-size: 14px;
    color: #242523;
    font-weight: 700;
}
.bacToList i {
    margin-right: 10px;
    color: #8EEB67;
}
.bacToList:hover {
    color: #8EEB67;
}
.bacToList span {
    text-transform: lowercase;
}
.data {
    width: 100%;
    display: table;
    clear: both;
}
.story-wrapper .eventDate {
    float: left;
    font-size: 20px;
    color: #969696;
    margin-top: 5px;
}
.addthis_toolbox {
    float: right;
    margin-bottom: 30px;
}
.addthis_toolbox div {
    display: inline-block;
}
.shareTxt {
    margin-right: 15px;
}
.data .shareLink a {
    width: 36px;
    height: 36px;
    display: block;
    margin-left: 10px;
    text-align: center;
    line-height: 36px;
    background-color: #E4E4E4;
    color: #333333;
    font-size: 16px;
}
.data .shareLink a:hover {
    background-color: #8EEB67;
    color: #333333;
}
h1.storyTitle {
    width: 100%;
    display: block;
    clear: both;
    border-top: 1px solid #D1D1D1;
    padding-top: 40px;
}
.lead {
    color: #969696;
    font-size: 21px;
    font-weight: 500;
    margin-bottom: 50px;
}
.data p {
    margin-bottom: 30px;
}

/* BOXES */

.hide {
    display: none;
}
.box1024,
.box512 {
    margin-bottom: 30px;
    position: relative;
}
.box512 {
    box-sizing: border-box;
}
.box-left {
    float: left;
    padding-right: 22px;
}
.box-right {
    float: right;
    padding-left: 22px;
}
.box-center {
    float: none;
    margin-left: auto;
    margin-right: auto;
}
.box-center.box512 {
    padding: 0 11px;
}
.contentWrapper {
    width: 100%;
    display: block;
}
.boxCaption {
    font-size: 12px;
    color: #fff;
    font-weight: 600;
    line-height: 25px;
    background-color: rgba(0,0,0,0.3);
    min-width: 380px;
    position: absolute;
    bottom: 0;
    padding: 0 20px;
    box-sizing: border-box;
}
.box1024 .boxCaption,
.box-left .boxCaption {
    left: 0;
}
.box512.box-center .boxCaption {
    left: 11px;
}
.box-right .boxCaption {
    left: 22px;
}
.box512 .boxCaption {
    max-width: calc(100% - 22px);
}
.data .contentBody a {
    font-weight: bold;
    text-decoration: underline;
    color: #333333;
}
.data .contentBody a:hover {
    color: #8EEB67;
}
.data hr {
    width: 100%;
    display: table;
    clear: both;
    margin: 0;
    border: none;
}
.audio-box audio {
    width: 100%;
}
.embedContent {
    position: relative; 
    padding-bottom: 56.25%;
    height: 0; 
    overflow: hidden;
}
.embedContent iframe {
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%;
}
.entrefilet-box .boxBody {
    font-size: 30px;
    color: #10120F;
    border-left: 8px solid #8EEB67;
    padding-left: 22px;
    font-weight: 500;
}
.boxLinks p {
    margin: 0;
}
.data .contentBody a.boxLink {
    font-size: 16px;
    color: #8EEB67;
    font-weight: 700;
    border-bottom: 1px solid #D1D1D1;
    padding: 10px 0;
    width: 100%;
    text-decoration: none;
    display: block;
}
.data .contentBody a.boxLink:hover {
    color: #10120F;
}
.boxFiles p {
    margin-bottom: 0;
}
.data .contentBody a.boxFile {
    font-size: 16px;
    color: #8EEB67;
    font-weight: 700;
    border-bottom: 1px dotted #D1D1D1;
    padding: 10px 0;
    width: 100%;
    text-decoration: none;
    display: block;
}
.data .contentBody a.boxFile:hover {
    color: #10120F;
}
span.formatSize {
    margin-left: 10px;
    font-weight: 300;
}
span.arrowDown {
    width: 16px;
    height: 16px;
    display: block;
    border-radius: 50%;
    background-color: #8EEB67;
    color: #333;
    line-height: 16px;
    text-align: center;
    font-size: 10px;
    transition: all .3s ease;
    margin-top: 3px;
}
a.boxFile:hover span.arrowDown {
    transition: all .3s ease;
    background-color: #333;
    color: #8EEB67;
}
span.arrowDown i {
    margin-left: 2px;
}
.data ul,
.data ol {
    margin-bottom: 30px;
    padding-left: 20px;
}
.data ol {
    padding-left: 30px;
}
.data ol li,
.data ul li {
    position: relative;
    font-size: 18px;
    font-weight: 500;
}
.data ul li:before {
    width: 10px;
    height: 10px;
    display: block;
    content: '';
    border-radius: 50%;
    background-color: #10120F;
    position: absolute;
    left: -20px;
    top: 7px;
}
.data ol li::marker {
    font-weight: 700;
    font-size: 21px;
}
.story-wrapper .addthis_toolbox:last-child {
    float: none;
}
.tagList a {
    margin-right: 10px;
}
.data .tagList a {
    float: left;
}
.tagRelated {
    background-color: #F9F9F9;
}
.tagRelated .partRow1 h3 {
    font-weight: 700;
    margin: 30px 0;
}
.topStoriesHorizontal {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 60px;
    margin-bottom: 80px;
}
.highlight,
.highlightCount {
    font-weight: 700;
}
.searchEmpty {
    margin-bottom: 30px;
}
.tagGrid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 46px;
    grid-row-gap: 80px;
}
.storyMainBox.tagRelated .storyImgWrapper {
    width: 100%;
    margin-right: 0;
}

/* ------------------------------ SIMPLE PAGE ------------------------------- */

.shareWrapper {
    width: 100%;
    display: table;
}
.shareWrapper .addthis_toolbox {
    float: left;
}

/* ------------------------------ CONTACT PAGE ------------------------------ */

.regionLeft {
    width: 100%;
    max-width: 380px;
    float: left;
}
.regionRight {
    width: calc(100% - 420px);
    float: right;
}
.contactForm {
    margin-bottom: 20px;
}
.contactForm .holderInner {
    width: 100%;
    margin-bottom: 20px;
}
.contactForm input,
.contactForm textarea {
    width: 100%;
    background-color: #F5F5F5;
    border: none;
    font-size: 14px;
    line-height: 18px;
    color: #333;
    padding: 10px 19px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transition: all .3s ease;
    border: 1px solid #F5F5F5;
}
.contactForm input.required, 
.contactForm textarea.required {
    border: 1px solid #8EEB67;
}
.contactForm input:focus,
.contactForm textarea:focus {
    -webkit-box-shadow: 0px 2px 11px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 2px 11px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 2px 11px 0px rgba(0,0,0,0.1);
    transition: all .3s ease;
}
.contactForm textarea {
    height: 160px;
}
.contactForm .QapTcha {
    float: none;
    max-width: none;
    border: 1px solid #8EEB67;
    margin-top: 60px;
}
.contactForm .QapTcha .bgSlider {
    max-width: none;
    height: 40px;
    float: left;
    background-image: none;
}
.contactForm .QapTcha .Slider {
    width: 62px;
    height: 40px;
    background: #8EEB67 url('/assets/front/img/Qaptcha.svg') center no-repeat;
}
.contactForm .QapTcha .dropError {
    width: calc(100% - 80px);
    font-size: 14px;
    color: #333;
    font-family: 'Epilogue', sans-serif;
    top: 50%;
    left: 80px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-transform: none;
}
.contactForm .QapTcha .dropSuccess {
    width: calc(100% - 90px);
    font-size: 14px;
    color: #8EEB67;
    font-family: 'Epilogue', sans-serif;
    top: 50%;
    left: 20px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-transform: none;
}
.contactForm button:disabled {
    opacity: 0.5;
    transition: all .3s ease;
    pointer-events: none;
}
.contactForm button {
    font-size: 16px;
    color: #fff;
    font-weight: 700;
    line-height: 18px;
    padding: 11px 5px;
    min-width: 146px;
    text-align: center;
    display: table;
    background-color: #8EEB67;
    margin: 50px auto;
    border: none;
}
.contactForm button:hover {
    background-color: #10120F;
}
.alert {
    margin-bottom: 20px;
    text-align: center;
    border: 1px solid #8EEB67;
    /*    color: #8EEB67;*/
    background-color: #8EEB67;
    color: #fff;
    font-weight: 600;
    border-radius: 0;
    font-size: 14px;
    line-height: 18px;
    padding: 11px 20px;
}

/* --------------------------------- SEARCH STRANA -------------------------- */

.searchPage .storyNav {
    width: 100%;
    display: table;
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 1px solid #D1D1D1;
}
.storyImgWrapper {
    width: 280px;
    float: left;
    margin-right: 20px;
    margin-bottom: 15px;
}
.storyImgWrapper a,
.storyImgWrapper a img {
    display: block;
    width: 100%;
    height: auto;
}
.storyImgWrapper a img {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transition: all .3s ease;
}
.storyImgWrapper a:hover img {
    -webkit-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    transition: all .3s ease;
}
.searchWrapperInfo {
    width: calc(100% - 300px);
    float: right;
}
.searchWrapperInfo .date {
    font-size: 16px;
    line-height: 1.2;
    color: rgba(0,0,0,0.5);
    display: block;
    text-transform: capitalize;
}
.searchWrapperInfo h2 {
    margin: 10px 0;
}
.searchWrapperInfo .lead {
    font-size: 18px;
    margin-bottom: 10px;
}
.searchWrapperInfo .bodyFragment {
    font-size: 14px;
    margin-bottom: 15px;
}
.searchWrapperInfo .highlight {
    color: #333;
}
.searchWrapperInfo a:hover {
    text-decoration: underline;
}
.searchPage .storyNav .storyImgWrapper {
    max-width: 280px;
}

/* --------------------------------- HOME PAGE ------------------------------ */

.homeBlack {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#121311+0,121311+10,242523+80,242523+100 */
    background: rgb(18,19,17);
    background: -moz-linear-gradient(-45deg,  rgba(18,19,17,1) 0%, rgba(18,19,17,1) 10%, rgba(36,37,35,1) 80%, rgba(36,37,35,1) 100%);
    background: -webkit-linear-gradient(-45deg,  rgba(18,19,17,1) 0%,rgba(18,19,17,1) 10%,rgba(36,37,35,1) 80%,rgba(36,37,35,1) 100%);
    background: linear-gradient(135deg,  rgba(18,19,17,1) 0%,rgba(18,19,17,1) 10%,rgba(36,37,35,1) 80%,rgba(36,37,35,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#121311', endColorstr='#242523',GradientType=1 );
    /*    padding-top: 20px;
        padding-bottom: 30px;*/
}
.homeGray {
    padding-top: 30px;
    background-color: #333;
}
.homeGray {
    padding-bottom: 30px;
}
.homeWhite {
    padding-top: 30px;
    background-color: #fff;
}

/* ----------------------------- SINGLE PRODUCT ----------------------------- */

.thumbWrapper {
    width: 482px;
    margin-right: 40px;
    float: left;
    position: relative;
}
.thumbWrapper img {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    z-index: 1;
}
.discount {
    width: 70px;
    height: 70px;
    display: block;
    border-radius: 50%;
    background-color: #8EEB67;
    text-align: center;
    line-height: 70px;
    color: #242523;
    font-weight: 800;
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 19px;
    z-index: 3;
}
.productData .discount {
    top: 20px;
    left: 20px;
}
.productDetails {
    width: calc(100% - 522px);
    float: right;
}
h1.productName.productName {
    margin: 0;
}
h3.perfomerWriter {
    font-weight: 500;
    margin: 0;
}
.productInfo {
    width: 100%;
    display: block;
    box-sizing: border-box;
    padding: 20px 110px 30px 30px;
    background-color: #F4FDF0;
    margin: 20px 0;
}
.productInfo .row {
    display: table;
    width: 100%;
    margin: 0 0 10px 0;
}
.firstInfo,
.secondInfo {
    display: block;
    float: left;
}
.firstInfo {
    min-width: 170px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    color: #969696;
    text-transform: uppercase;
}
.secondInfo {
    font-size: 16px;
    line-height: 18px;
    font-weight: 700;
    color: #333;
    width: calc(100% - 170px);
}
/*.productInfo .divider {
    width: 100%;
    display: block;
    margin: 20px 0 20px;
    border-top: 2px solid #D1D1D1;
    position: relative;
}*/
/*.productInfo .divider:after {
    width: 100%;
    display: block;
    height: 1px;
    background-color: #D1D1D1;
    content: '';
    position: absolute;
    top: 20px;
    left: 0;
}*/
.productInfo .row.priceRow {
    display: flex;
    align-items: flex-end;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #D1D1D1;
}
.productInfo .oldPrice {
    font-weight: 600;
    display: table;
    position: relative;
    font-size: 18px;
    color: #969696;
    -webkit-text-decoration-color: #969696;
    text-decoration-color: #969696;
    -webkit-text-decoration-line: line-through;
    text-decoration-line: line-through;
    margin-bottom: 5px;
}
.productInfo .productPrice {
    font-size: 24px;
    font-weight: 900;
    color: #10120F;
}
.moreLessWrapper,
.addToCardBtn {
    display: inline-block;
}
.moreLess {
    border: 1px solid #10120F;
}
.moreLess i,
.moreLess span {
    min-width: 30px;
    text-align: center;
    line-height: 38px;
    font-size: 16px;
    color: #333;
    font-weight: 700;
    display: inline-block;
}
.moreLess i {
    cursor: pointer;
    color: #969696;
    font-size: 14px;
    transition: all .3s ease;
}
.moreLess i:hover {
    color: #333;
    transition: all .3s ease;
}
.productInfo .button {
    display: inline-block;
    margin-left: 40px;
    min-width: 146px;
    margin-top: 0;
}
.priceRow .fmt {
    margin-bottom: 15px;
    display: block;
}
.priceRow .newPrice {
    margin-bottom: 10px;
    display: block;
}
.productBody {
    width: 100%;
    padding: 0 30px;
    display: table;
    box-sizing: border-box;
}
.productBody h6 {
    margin: 30px 0 20px;
    color: #969696;
    font-weight: 600;
}
.data .productBody hr {
    width: 100%;
    display: table;
    clear: both;
    margin: 40px 0 30px;
    border: 1px solid #D1D1D1;
}
.productLead {
    color: #969696;
    font-size: 21px;
    font-weight: 500;
    margin-bottom: 30px;
}
.productBody .addthis_toolbox {
    margin-bottom: 0;
}
/*.productData {
    padding-bottom: 40px;
}*/
.sameAuthor {
    border-top: 1px solid #D1D1D1;
    margin-top: 40px;
}
h5.sameAuthor-title {
    margin: 20px 0;
    font-weight: 700;
}
.sameAuthor-list {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    column-gap: 40px;
}
.productImgWrapper {
    position: relative;
}
.sameAuthor-list .productImgWrapper {
    width: 100px;
    float: left;
    margin-right: 10px;
}
.productImgWrapper img {
    width: 100%;
    height: auto;
    display: block;
    transition: all .3s ease;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
a.item:hover .productImgWrapper img {
    transition: all .3s ease;
    -webkit-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
}
.sameAuthor-list .discount {
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
}
.productText {
    margin-top: 25px;
    padding-left: 15px;
    border-left: 2px solid #8EEB67;
}
.sameAuthor-list .productText {
    width: calc(100% - 110px);
    float: left;
    margin-top: 0;
    padding-left: 0;
    border-left: 0;
}
.productText span {
    display: block;
}
.productText .tag {
    font-size: 14px;
    font-weight: 500;
    color: #8EEB67;
}
.productText .tag .tagList {
    display: inline-block;
}
.vinil .productText .tag .tagList {
    text-transform: uppercase;
}
.sameAuthor-list .productText .tag {
    font-size: 12px;
}
.productText .title {
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;
    transition: all .3s ease;
    line-height: 20px;
    color: #333;
}
a.item:hover .productText .title {
    text-decoration: underline;
    transition: all .3s ease;
}
.sameAuthor-list .productText .title {
    font-size: 14px;
}
.productText .author {
    font-size: 16px;
    font-weight: 500;
    color: #8EEB67;
}
.productText .publisher {
    font-size: 12px;
    color: rgba(51,51,51,0.5);
    text-transform: uppercase;
    font-weight: 500;
}
.productText .price {
    margin-top: 10px; 
}
.productText .oldPrice {
    font-size: 16px;
    font-weight: 600;
    color: #969696;
    webkit-text-decoration-color: #969696;
    text-decoration-color: #969696;
    -webkit-text-decoration-line: line-through;
    text-decoration-line: line-through;
    display: inline;
}
.sameAuthor-list .oldPrice {
    font-size: 14px;
}
.productText .newPrice {
    font-weight: 800;
    font-size: 20px;
    color: #10120F;
}
.sameAuthor-list .newPrice {
    font-size: 16px;
}
.similarProducts {
    background-color: #F9F9F9;
    padding-bottom: 40px;
}
.similarProductsList {
    display: grid;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    column-gap: 40px;
}
.item.productBox {
    margin-bottom: 40px;
}
a.item {
    width: 100%;
    display: table;
}
a.item span.button {
    min-width: 166px;
    margin-top: 30px;
}
h3.similarProducts-title {
    /*    margin: 30px 0;*/
    font-weight: 700;
}
.data.productData ol {
    list-style-type: decimal-leading-zero;
}
.data.productData ol li::marker {
    font-weight: 400;
}

/* ZOOM GALERIJA */

.main-img {
    width: 100%;
    height: 0;
    padding-top: 100%;
    position: relative;
}
a.zooming.zoomple {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #E4E4E4;
    cursor: default;
    top: 0;
    left: 0;
}
img.media-large-img {
    max-height: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.mediaSetProduct {
    width: calc(100% + 28px);
    margin: 28px -14px;
}
.productGalleryWrapper {
    width: 100%;
    display: table;
}
.media-thumbs {
    display: block;
    float: left;
    width: 25%;
    box-sizing: border-box;
    overflow: hidden;
    margin-bottom: 24px;
    position: relative;
    /*    background-color: #E4E4E4;*/
    padding: 0 14px;
    box-sizing: border-box;
}
.media-thumbs:before {
    width: 100%;
    height: 0;
    padding-top: 100%;
    display: block;
    content: '';
    background-color: #E4E4E4;
    position: relative;
}
.media-thumb-img {
    width: 100%;
    height: 100%;
    background-size: contain;
    background-position: center;
    cursor: pointer;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
}

#zoomple_previewholder {
    display: none !important;
}
a.zooming.zoomple {
    pointer-events: none !important;
}

/* -------------------------------- PRODUCT LIST ---------------------------- */

/* FILTER RESULTS */

.shownProducts {
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: 500;
}
.filterOptionsWrapper {
    width: calc(100% - 250px);
    display: table;
    margin-bottom: 10px;
    float: left;
}
.filterOptionsWrapper .filterOptions {
    float: left;
    display: table;
    font-size: 10px;
    font-weight: 600;
    line-height: 12px;
    padding: 4px 10px;
    background-color: rgba(142,235,103,0.3);
    margin: 0 10px 10px 0;
}
.filterOptions .remove {
    margin-left: 5px;
    cursor: pointer;
    transition: all .3s ease;
}
.filterOptions .remove:hover {
    color: #10120F;
    transition: all .3s ease;
}
/* */
.sortWrapper {
    display: table;
    float: right;
    height: 30px;
    margin-bottom: 10px;
}
.sortWrapper .label {
    font-weight: 500;
    font-size: 14px;
    float: left;
    margin-right: 5px;
    margin-top: 2px;
}
.sortWrapper select {
    border: none;
    color: #5E5F5E !important;
    font-size: 14px;
    line-height: 16px;
    min-width: 175px;
    padding: 0 20px 0 10px;
    box-sizing: border-box;
    min-width: 190px;
    background: #fff url('/assets/front/img/Arrow-down.svg') no-repeat right center !important;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.green {
    color: #8EEB67;
}
.filterNumber .green {
    color: #A8ED5E;
}
.productListWrapper {
    width: 100%;
    clear: both;
}
.gridProductWrapper {
    overflow: hidden;
    width: 100%;
}
.gridProduct {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 46px;
    grid-row-gap: 40px;
    margin-bottom: -40px;
}
.gridProduct .productNav {
    padding-bottom: 40px;
    position: relative;
}
.gridProduct .productNav:after {
    width: calc(100% + 50px);
    height: 1px;
    background-color: #D1D1D1;
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
}
.dataNav a,
.sameAuthor-list a,
.similarProducts a {
    color: #333;
}

/* -------------------------- SIDEBAR FILTER -------------------------------- */

.responsiveFilterSortButtons {
    display: none;
}
.booksSidebar,
.vinilSidebar,
.userSidebar {
    width: 100%;
    box-sizing: border-box;
    /*    padding: 0 20px;*/
}
.booksSidebar,
.vinilSidebar {

}
body.withSidebar #stripe1.filterSidebar {
    position: relative;
    padding-bottom: 140px;
}
.scrollVertical {
    /*    overflow-y: auto;
        max-height: calc(100vh - 164px);
        padding-right: 10px;*/
    display: block;
}
.singleFilterWrapper.noBorder {
    /*    margin-bottom: 120px;*/
}
.filterButtons {
    position: relative;
    width: 100%;
    z-index: 99;
}
.filterButtons.fixed {
    width: 210px;
    /*    position: fixed;
        left: calc(50% - 610px);*/
    position: absolute;
    left: 20px;
    bottom: 20px;
    /*    transition: all 0.3s ease;*/
}
.filterButtons.fixed.fixed-new {
    position: absolute;
    left: 20px;
    bottom: 20px;
    /*    transition: all 0.3s ease;*/
}
.searchInput {
    margin-bottom: 30px;
}
.searchInput input {
    border: 1px solid #fff;
    transition: color .3s ease;
    background-color: #fff;
    color: #333;
    font-size: 14px;
    line-height: 16px;
    padding: 12px 5px 12px 20px;
    width: 100%;
    box-sizing: border-box;
}
.searchInput input:focus {
    border: 1px solid #8EEB67;
}
.searchInput ::-webkit-input-placeholder {
    font-style: italic;
}
.searchInput ::-moz-placeholder { 
    font-style: italic;
}
.searchInput :-ms-input-placeholder { 
    font-style: italic;
}
.searchInput :-moz-placeholder { 
    font-style: italic;
}
#stripe1 h6 {
    margin: 20px 0;
    color: #333;
    font-weight: 700;
}
#stripe1 h6.title-filter i {
    cursor: pointer;
    float: right;
    transition: all 0.3s ease;
    color: #333;
    display: none;
}
.booksSidebar h6.author,
.vinilSidebar h6.performer {
    display: block;
}
.booksSidebar h6.perfomer,
.vinilSidebar h6.author {
    display: none;
}
.allOptions {
    display: block;
    width: 100%;
    padding-bottom: 10px;
}
.filterRow {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 10px;
}
.optionCount {
    color: #969696;
    font-weight: 600;
}
/* CUSTOMCHECKBOX */
.customCheckbox {
    display: block;
    position: relative;
    width: 16px;
    height: 16px;
    display: block;
    margin-right: 10px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    float: left;
}
.customCheckbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
/* Create a custom checkbox */
.customCheckbox .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 16px;
    width: 16px;
    background-color: #fff;
    border: 1px solid #333;
}
/* On mouse-over, add a grey background color */
/*.customCheckbox:hover input ~ .checkmark {
    background-color: #ccc;
}*/
/* When the checkbox is checked, add a background */
.customCheckbox input:checked ~ .checkmark {
    background-color: #fff;
    border: 1px solid #333;
}
/* Create the checkmark/indicator (hidden when not checked) */
.customCheckbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
/* Show the checkmark when checked */
.customCheckbox input:checked ~ .checkmark:after {
    display: block;
}
/* Style the checkmark/indicator */
.customCheckbox .checkmark:after {
    left: 2px;
    top: 2px;
    width: 10px;
    height: 10px;
    background-color: #8EEB67;
}
.checkText {
    font-weight: 500;
}
.option.bold .checkText {
    font-weight: 700;
}
.restOptions {
    overflow: hidden;
    height: 0;
    transition: all .3s ease;
}
.restOptions.open {
    height: auto;
    transition: all .3s ease;
} 
.restOptionButton {
    margin-top: 10px;
    position: relative;
    padding: 5px 0 10px;
    margin-bottom: 10px;
    font-size: 12px;
    text-align: center;
    font-weight: 600;
    cursor: pointer;
}
.restOptionButton:before {
    width: 100%;
    max-width: 110px;
    height: 1px;
    background-color: #333;
    display: block;
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
.restOptionButton .moreText {
    display: block;
}
.restOptionButton .lessText {
    display: none;
}
.restOptionButton.active .moreText {
    display: none;
}
.restOptionButton.active .lessText {
    display: block;
}
.restOptionButton:after {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #8EEB67;
    position: absolute;
    left: 50%;
    bottom: 0;
    display: block;
    content: '';
    margin-left: -5px;
    transition: all .3s ease;
}
.restOptionButton.active:after {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: all .3s ease;
}
.singleFilterWrapper {
    border-bottom: 1px solid #D1D1D1;
}
.singleFilterWrapper.noBorder {
    border-bottom: none;
}
#stripe1 .button.fullWidth {
    margin-top: 20px;
}
.button.apply,
.button.reset {
    border: 1px solid #10120F;
    padding: 10px 5px;
}
.button.reset {
    color: #10120F;
    background-color: #fff;
}
.filterButtons .button.reset {
    background-color: #F4FDF0;
}
.button.apply:hover,
.button.reset:hover,
.filterButtons .button.reset:hover {
    color: #10120F;
    background-color: #8EEB67;
    border: 1px solid #8EEB67;
}
.filterSidebar .button.apply, 
.filterSidebar .button.reset {
    -webkit-box-shadow: 0px 0px 10px 10px rgba(244,253,240,1);
    -moz-box-shadow: 0px 0px 10px 10px rgba(244,253,240,1);
    box-shadow: 0px 0px 10px 10px rgba(244,253,240,1);
}
/*body.withSidebar #stripe1.filterSidebar {
    padding-right: 10px;
}
#stripe1.filterSidebar .filterButtons {
    padding-right: 10px;
}*/

/* ------------------------------- LOG IN ----------------------------------- */

.userContainer {
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
}
form.user .holder {
    margin-bottom: 15px;
    display: table;
    width: 100%;
}
form.user label.text {
    width: 100%;
    display: block;
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 5px;
}
form.user input {
    width: 100%;
    line-height: 18px;
    border: 1px solid #F5F5F5;
    background-color: #F5F5F5;
    transition: color .3s ease;
    font-size: 14px;
    padding: 12px 20px;
    color: #333;
}
form.user input::placeholder {
    font-style: italic;
}
form.user input:focus {
    /*    border: 1px solid #8EEB67;*/
    border: 1px solid #F5F5F5;
    background-color: transparent;
    transition: color .3s ease;
}
form.user a {
    font-weight: 500;
}
form.user .checkText {
    font-weight: 400;
}
form.user .customCheckbox {
    margin-top: 3px;
    margin-bottom: 3px;
}
form.user button.center {
    margin: 50px auto 30px;
}
h1 .p {
    font-weight: 400;
    font-size: 12px;
    display: block;
}
form.user .holder.half {
    width: 50%;
    box-sizing: border-box;
    float: left;
}
form.user .holder.half.first {
    padding-right: 20px;
    clear: left;
}
form.user .holder.half.second {
    padding-left: 20px;
}
form.user select {
    width: 100%;
    border: 1px solid #F5F5F5;
    color: #333 !important;
    font-size: 14px;
    line-height: 18px;
    padding: 12px 20px;
    box-sizing: border-box;
    min-width: 190px;
    background: #F5F5F5 url('/assets/front/img/Arrow-down.svg') no-repeat right 10px center !important;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    transition: color .3s ease;
}
p.smallerP {
    font-size: 14px;
}
form.user .QapTcha {
    float: none;
    max-width: none;
    border: 1px solid #8EEB67;
    margin-top: 10px;
}
form.user .QapTcha .bgSlider {
    max-width: none;
    height: 40px;
    float: left;
    background-image: none;
}
form.user .QapTcha .Slider {
    width: 62px;
    height: 40px;
    background: #8EEB67 url('/assets/front/img/Qaptcha.svg') center no-repeat;
}
form.user .QapTcha .dropError {
    width: calc(100% - 80px);
    font-size: 14px;
    color: #333;
    font-family: 'Epilogue', sans-serif;
    top: 50%;
    left: 80px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-transform: none;
}
form.user .QapTcha .dropSuccess {
    width: calc(100% - 90px);
    font-size: 14px;
    color: #8EEB67;
    font-family: 'Epilogue', sans-serif;
    top: 50%;
    left: 20px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-transform: none;
}
form.user.passwordRecoveryForm button:disabled {
    opacity: 0.5;
    transition: all .3s ease;
    pointer-events: none;
}
form.user.passwordRecoveryForm button {
    font-size: 16px;
    color: #10120F;
    font-weight: 700;
    line-height: 18px;
    padding: 11px 5px;
    min-width: 146px;
    text-align: center;
    display: table;
    background-color: #8EEB67;
    margin: 0;
    border: none;
}
form.user.passwordRecoveryForm button:hover {
    background-color: #10120F;
    color: #fff;
}
form.user .centerButtons {
    padding: 25px 0;
    text-align: center;
}
form.user.passwordRecoveryForm .centerButtons button,
form.user .centerButtons a {
    display: inline-block;
    margin: 10px 10px;
    min-width: 158px;
}
.activationWrapper a.center {
    margin: 40px auto;
}
.activationWrapper input.button.green {
    margin: 50px auto;
    width: auto;
    min-width: 140px;
    display: table;
}

/* --------------------------------- PROFIL --------------------------------- */

h1.sidebar-title {
    font-size: 26px;
    margin: 0 0 20px;
    font-weight: 800;
}
h6.mt-30 {
    margin-top: 30px;
}
.userSidebar .topTabs {
    width: calc(100% + 40px);
    margin: 0 -20px;
}
.userSidebar .tabs-links {
    display: block;
    border: none;
    width: 100%;
    padding: 0;
    margin: 0 0 20px;      
}
a.tabLink {
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    padding: 10px 5px 10px 20px;
    background-color: transparent;
    display: table;
    color: #333;
}
a.tabLink.active,
a.tabLink:hover {
    background-color: rgba(142,235,103,0.25);
    font-weight: 600;
}
a.tabLink .iconWrapper {
    width: 20px;
    height: 20px;
    display: block;
    float: left;
    margin-right: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #5C5C5C;
    transition: all .3s ease;
}
a.tabLink.basicData .iconWrapper {
    -webkit-mask-image: url("../img/Icon-UserData.svg");
    mask-image: url("../img/Icon-UserData.svg");
}
a.tabLink.passwordChange .iconWrapper {
    -webkit-mask-image: url("../img/Icon-Password.svg");
    mask-image: url("../img/Icon-Password.svg");
}
a.tabLink.myAddress .iconWrapper {
    -webkit-mask-image: url("../img/Icon-Address.svg");
    mask-image: url("../img/Icon-Address.svg");
}
a.tabLink.shopingHistory .iconWrapper {
    -webkit-mask-image: url("../img/Icon-History.svg");
    mask-image: url("../img/Icon-History.svg");
}
a.tabLink.basicData.active .iconWrapper,
a.tabLink.basicData:hover .iconWrapper,
a.tabLink.passwordChange.active .iconWrapper,
a.tabLink.passwordChange:hover .iconWrapper,
a.tabLink.myAddress.active .iconWrapper,
a.tabLink.myAddress:hover .iconWrapper,
a.tabLink.shopingHistory.active .iconWrapper,
a.tabLink.shopingHistory:hover .iconWrapper {
    background-color: #333;
    transition: all .3s ease;
}
/* USER NAV TAG */
.userSidebar .logINNav {
    float: none;
    margin: 0 0 20px;
    width: 100%;
}
.userSidebar ul.logINNav li {
    float: none;
    width: 100%;
}
.userSidebar ul.logINNav li.logout,
.userSidebar ul.logINNav a.logout {
    display: none !important;
}
.userSidebar .dropbtn,
.userSidebar .dropdown::before {
    display: none;
}
.userSidebar .dropdown-content,
.userSidebar .dropdown:hover .dropdown-content {
    display: table;
    width: 100%;
    position: relative;
    min-width: inherit;
    right: auto;
    top: auto;
}
.userSidebar ul.logINNav .dropdown-content a {
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    padding: 10px 5px 10px 20px;
    background-color: transparent;
    display: table;
    color: #333;
    position: relative;
    font-weight: 500;
}
.userSidebar ul.logINNav .dropdown-content a.active,
.userSidebar ul.logINNav .dropdown-content a:hover {
    color: #000;
    background-color: rgba(142,235,103,0.25);
}
.userSidebar ul.logINNav .dropdown-content a:before {
    width: 20px;
    height: 20px;
    display: block;
    content: '';
    float: left;
    margin-right: 10px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #5C5C5C;
    transition: all .3s ease;
}
.userSidebar ul.logINNav .dropdown-content a.active:before,
.userSidebar ul.logINNav .dropdown-content a:hover:before {
    background-color: #333;
    transition: all .3s ease;
}
.userSidebar ul.logINNav .dropdown-content a.basicData:before {
    -webkit-mask-image: url("../img/Icon-UserData.svg");
    mask-image: url("../img/Icon-UserData.svg");
}
.userSidebar ul.logINNav .dropdown-content a.passwordChange:before {
    -webkit-mask-image: url("../img/Icon-Password.svg");
    mask-image: url("../img/Icon-Password.svg");
}
.userSidebar ul.logINNav .dropdown-content a.myAddress:before {
    -webkit-mask-image: url("../img/Icon-Address.svg");
    mask-image: url("../img/Icon-Address.svg");
}
.userSidebar ul.logINNav .dropdown-content a.shopingHistory:before {
    -webkit-mask-image: url("../img/Icon-History.svg");
    mask-image: url("../img/Icon-History.svg");
}

/* END USER NAV TAG */
h1.page-title.mt-30 {
    margin-top: 30px;
}
h4.userName {
    margin-top: 30px;
    color: #5C5C5C;
    font-weight: 800;
}
form.userData input::-webkit-input-placeholder {
    font-style: normal;
    opacity: 1;
}
form.userData input::-moz-placeholder { 
    font-style: normal;
    opacity: 1;
}
form.userData input:-ms-input-placeholder { 
    font-style: normal;
    opacity: 1;
}
form.userData input:-moz-placeholder { 
    font-style: normal;
    opacity: 1;
}
form.userData input.newInputText::-webkit-input-placeholder {
    font-style: normal;
    opacity: 0.5;
    font-style: italic;
}
form.userData input.newInputText::-moz-placeholder { 
    font-style: normal;
    opacity: 0.5;
    font-style: italic;
}
form.userData input.newInputText:-ms-input-placeholder { 
    font-style: normal;
    opacity: 0.5;
    font-style: italic;
}
form.userData input.newInputText:-moz-placeholder { 
    font-style: normal;
    opacity: 0.5;
    font-style: italic;
}
form.userData input:disabled {
    border: 1px solid rgba(245,245,245,0.25);
    background-color: rgba(245,245,245,0.25);
    pointer-events: none;
}
form.userData input {
    border: 1px solid #E4E4E4;
    background-color: #fff;
}
form.userData select {
    background: #fff url('/assets/front/img/Arrow-down.svg') no-repeat right 10px center !important;
}
form.userData select:disabled {
    background: rgba(245,245,245,0.25) url('/assets/front/img/Arrow-down.svg') no-repeat right 10px center !important;
    border: 1px solid rgba(245,245,245,0.25);
}
form.user.userData .centerButtons {
    padding-bottom: 0;
    margin-bottom: 0;
}
form.userData .centerButtons button {
    display: inline-block;
}
form.userData .centerButtons button,
form.userData .centerButtons a {
    min-width: 160px;
    margin: 0 20px 10px;
}
form.userData .centerButtons whitespace {
    display: none;
}
.app-wrapper.user-wrapper > .container {
    min-height: 700px;
}
.input-password-container {
    width: 100%;
    position: relative;
}
form .input-password-container input {
    padding-right: 30px;
}
.input-password-container i {
    color: #aaa;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
table.history {
    width: 100%;
    color: #5C5C5C;
    font-weight: 600;
}
table.history th {
    color: #969696;
    font-weight: 700;
    font-size: 13px;
    line-height: 16px;
    padding: 4px 20px;
    background-color: #F4FDF0;
}
table.history td {
    line-height: 18px;
    padding: 16px 20px;
    transition: all 0.3s ease;
    background-color: #fff;
}
table.history tbody tr:nth-of-type(2n) td {
    background-color: #FBFBFB;
}
.statusBorder {
    font-size: 9px;
    font-weight: 500;
    min-width: 80px;
    line-height: 14px;
    border: 1px solid #333;
    display: inline-block;
    text-transform: uppercase;
    transition: all 0.3s ease;
}
table.history td.view {
    text-align: right;
    padding: 10px 20px;
}
table.history td.view a {
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    line-height: 30px;
    background-color: #E8E8E8;
    transition: all 0.3s ease;
    cursor: pointer;
    color: #5C5C5C;
}
table.history tr:hover td,
table.history tbody tr:nth-of-type(2n):hover td {
    background-color: #F4FDF0;
    transition: all 0.3s ease;
}
table.history tr:hover .statusBorder {
    background-color: #8EEB67;
    border: 1px solid #8EEB67;
}
table.history tr:hover td.view a {
    background-color: #8EEB67;
    color: #333;
}
.viewPurchaseWrapper {
    width: 100%;
    margin-top: 30px;
}
.statusBorder {
    border: 1px solid #8EEB67;
    background-color: #8EEB67;
    font-weight: 700;
    text-align: center;
}
h4.orderId {
    margin: 5px 0;
}
h4.orderId span,
.orderDate span {
    color: #969696;
}
.orderDate {
    font-size: 14px;
    line-height: 16px;
    font-weight: 700;
}

/* -------------------------------- BASKET ---------------------------------- */

table.basket {
    width: 100%;
    table-layout:fixed;
    font-size: 13px;
}
table.basket td,
table.basket th {
    text-align: center;
}
table.basket th {
    padding: 10px 5px 0 5px;
    font-size: 13px;
    color: #969696;
    font-weight: 700;
}
table.basket tr th:first-child,
table.basket tr td:first-child {
    padding-left: 0;
    text-align: left;
}
table.basket tr th:last-child,
table.basket tr td:last-child {
    padding-right: 0;
    text-align: right;
}
table.basket td.titleWrapper,
table.basket th.titleHolder {
    width: 50%;
    box-sizing: border-box;
}
table.basket td.category,
table.basket td.price,
table.basket td.moreLessHolder,
table.basket td.total,
table.basket th.categoryHolder {
    width: 12%;
    box-sizing: border-box;
    min-width: 130px;
}
table.basket td.delete,
table.basket th.close {
    width: 2%;
    box-sizing: border-box;
    float: none;
}
table.basket td {
    padding: 20px 5px;
    border-bottom: 1px solid #D1D1D1;
}
td.titleWrapper .productThumb {
    width: 80px;
    display: block;
}
td.titleWrapper .imgWrapper {
    margin-right: 20px;
    float: left;
}
td.titleWrapper img {
    width: 100%;
    height: auto;
    display: block;
    transition: all .3s ease;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
td.titleWrapper .productThumb:hover {
    transition: all .3s ease;
    -webkit-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
}
td.titleWrapper .textWrapper {
    float: left;
    width: calc(100% - 100px);
}
td.titleWrapper .productTitle {
    color: #333;
}
td.titleWrapper .productTitle:hover {
    color: #8EEB67;
}
td.titleWrapper .productTitle span {
    display: block;
}
td.titleWrapper span.title {
    font-size: 18px;
    line-height: 1.2;
    font-weight: 700;
}
td.titleWrapper span.author {
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
}
td.titleWrapper span.publisher {
    font-size: 12px;
    line-height: 1.2;
    font-weight: 500;
    color: #969696;
    transition: all 0.3s ease;
}
td.titleWrapper .productTitle:hover span.publisher {
    color: #8EEB67;
    transition: all 0.3s ease;
}
table.basket td.total {
    font-weight: 700;
}
table.basket td.delete i {
    cursor: pointer;
    color: #D8D8D8;
    transition: all 0.3s ease;
    font-size: 20px;
    line-height: 1;
    padding: 10px 0 5px;
}
table.basket td.delete i:hover {
    color: #333;
    transition: all 0.3s ease;
}
table.basket tr.noBorder td {
    border-bottom: none;
}
table.basket td.totalPrice {
    padding: 40px 0;
    font-size: 16px;
    color: #10120F;
    font-weight: 800;
}
table.basket td.logIn {
    padding-top: 0;
}
table.basket td.price,
table.basket td.total,
table.basket td.totalPrice {
    text-transform: uppercase;
}
.viewPurchaseWrapper table.basket th,
.viewPurchaseWrapper table.basket td {
    text-align: left;
}
.viewPurchaseWrapper table.basket th,
.viewPurchaseWrapper table.basket tr th:last-child {
    background-color: #F9F9F9;
    padding: 5px;
}
.viewPurchaseWrapper table.basket tr th:first-child {
    padding-left: 20px;
}
.viewPurchaseWrapper table.basket tr th:last-child {
    text-align: right;
}
td.logIn a,
td.logIn a.button {
    display: inline-block;
    margin: 0 0 0 40px;
}
td.logIn a.button.proceed {
    padding: 11px 10px;
}
td.logIn a.button.mb-30 {
    margin-bottom: 30px;
}
a.backToShop {
    color: #8EEB67;
}
a.backToShop span {
    font-size: 16px;
    font-weight: 700;
    color: #10120F;
    margin-left: 5px;
    transition: all 0.3s ease;
}
a.backToShop:hover span {
    transition: all 0.3s ease;
    color: #8EEB67;
}
h6.withButtons {
    width: calc(100% - 100px);
    float: left;
}
.printButtonsWrapper {
    float: right;
    margin-top: 25px;
}
.printButtons {
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    cursor: pointer;
    background-color: #E8E8E8;
    display: inline-block;
    margin-left: 10px;
    transition: all 0.3s ease;
}
.printButtons:hover {
    background-color: #8EEB67;
    transition: all 0.3s ease;
}

/* --------------------------- PLACANJE POUZECEM ---------------------------- */

h6.mb-20 {
    margin-bottom: 20px;
}
h6 .nimber {
    color: #8EEB67;
}
table.basket.checkoutList td, 
table.basket.checkoutList th {
    text-align: left;
}
table.basket.checkoutList th,
table.basket.checkoutList td {
    padding: 10px 20px;
}
table.basket.checkoutList tr th:first-child, 
table.basket.checkoutList tr td:first-child {
    padding-left: 20px;
}
table.basket.checkoutList tr th:last-child, 
table.basket.checkoutList tr td:last-child {
    padding-right: 20px;    
}
table.checkoutList {
    background-color: #F4FDF0;
}
tr.singleItem span.quantity span {
    font-weight: 700;
}
table.basket.checkoutList td {
    border-bottom: 0;
}
table.basket.checkoutList td.titleWrapper, 
table.basket.checkoutList th.titleHolder {
    width: 52%;
}
table.basket.checkoutList tr {
    position: relative;
}
table.basket.checkoutList tr:after {
    position: absolute;
    height: 1px;
    display: block;
    content: '';
    left: 20px;
    right: 20px;
    bottom: 0;
    background-color: #D1D1D1;
    width: calc(100% - 40px);
}
table.basket.checkoutList tr.noBorder:after {
    display: none;
}
table.basket.checkoutList tr.total td {
    padding: 20px 20px 35px;
}
.totalFmt {
    margin-right: 20px;
}
.holder.withText {
    position: relative;
}
.redNote {
    color: #D0021B;
    font-size: 12px;
}
.holder.withText .redNote {
    text-align: right;
    position: absolute;
    right: 0;
    bottom: -15px;
}
form.user.paymentForm input {
    background-color: #fff;
}
.contactForm.paymentForm button {
    color: #10120F;
}
.contactForm.paymentForm button:hover {
    color: #fff;
}
.biger.bold {
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 0;
}
.radioImg img {
    float: right;
}
.radioHolderCircle {
    margin: 8px 25px 0 0;
}
.radioHolderCircle .customCheckbox .checkmark,
.radioHolderCircle .customCheckbox .checkmark::after {
    border-radius: 50%;
}
.contactForm.paymentForm button {
    margin-top: 24px;
}
form.user .checkText.f-w-normal {
    font-weight: 400;
}
form.user .holder.anotherAddressCheckBox {
    margin-top: 35px;
}
.anotherAddressFields {
    width: 100%;
    display: block;
    clear: both;
    height: 0;
    overflow: hidden;
    transition: all 0.3s ease;
}
.anotherAddressFields.active {
    height: auto;
    transition: all 0.3s ease;
}
.anotherAddressFields h6 {
    margin: 0 0 30px;
    padding-top: 30px;
    border-top: 1px solid #d1d1d1;
}
.anotherAddressCheck {
    margin-top: 35px;
}
.payCreditCard {
    /*    opacity: 0.5;
        pointer-events: none;*/
}
.paymentMethodWrapper {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

/* ------------------------------ ORDER SUCCESS ----------------------------- */

table.orderInfo {
    margin-bottom: 30px;
}
table.orderInfo td {
    padding-left: 20px;
}
table.order {
    background-color: #F4FDF0;
    width: 100%;
    table-layout: fixed;
    font-size: 13px;
}
table.order th,
table.order td {
    padding: 10px 20px;
}
table.order th.titleHolder {
    width: 52%;
}
table.order th.categoryHolder {
    width: 12%;
    box-sizing: border-box;
}
table.order th {
    color: #969696;
    font-weight: 700;
}
table.order td.totalPrice {
    font-size: 16px;
    color: #10120F;
    font-weight: 800;
    text-transform: uppercase;
    padding: 20px 20px 35px;
}
table.order tr {
    position: relative;
}
table.order tr::after {
    position: absolute;
    height: 1px;
    display: block;
    content: '';
    left: 20px;
    right: 20px;
    bottom: 0;
    background-color: #D1D1D1;
    width: calc(100% - 40px);
}
table.order tr.noBorder::after {
    display: none;
}

form.user .holder.iAgree {
    text-align: left;
    margin-bottom: 90px;
}

/* ------------------------------- FILTER SIDEBAR --------------------------- */

body.withSidebar #stripe1.filterSidebar {
    position: fixed;
    top: 80px;
    bottom: 0;
    left: 50%;
    -moz-transform: translateX(-630px);
    -webkit-transform: translateX(-630px);
    -o-transform: translateX(-630px);
    -ms-transform: translateX(-630px);
    transform: translateX(-630px);
    transition: all 0.3s ease;
    padding: 0;
}
body.withSidebar #stripe1.filterSidebar.fixed-top {
    top: 50px;
}
.filterSidebarHolder {
    height: 100%;
    padding: 30px 0 140px;
    box-sizing: border-box;
    /*    overflow-y: auto;*/
    position: relative;
}
.filterSidebarInnerHolder {
    overflow-y: auto;
    padding: 0 20px;
    height: 100%;
}
.filterButtons.fixed {
    left: 20px;
}

/* ------------------------------- ARTISTS INDEX ---------------------------- */

.artistsGrid .gridStory {
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
a.storyList.artistsList {
    position: relative;
}
.artistsList img {
    display: block;
    width: 100%;
    position: relative;
    z-index: 1;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transition: all .3s ease;
}
a.artistsList:hover img {
    -webkit-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.5);
    transition: all .3s ease;
}
/*.artistsList .imgMask {
    position: absolute;
    z-index: 2;
    background: -moz-linear-gradient(top,  rgba(16,18,15,0) 0%, rgba(16,18,15,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(16,18,15,0) 0%,rgba(16,18,15,1) 100%);
    background: linear-gradient(to bottom,  rgba(16,18,15,0) 0%,rgba(16,18,15,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0010120f', endColorstr='#10120f',GradientType=0 );
}*/
.artistsList h5.title {
    font-size: 28px;
    font-weight: 700;
    color: #fff;
    background: -moz-linear-gradient(top,  rgba(16,18,15,0) 0%, rgba(16,18,15,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(16,18,15,0) 0%,rgba(16,18,15,1) 100%);
    background: linear-gradient(to bottom,  rgba(16,18,15,0) 0%,rgba(16,18,15,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0010120f', endColorstr='#10120f',GradientType=0 );
    display: flex;
    align-items: flex-end;
    width: 100%;
    padding: 10px 40px 30px;
    box-sizing: border-box;
    position: absolute;
    z-index: 3;
    bottom: 0;
    left: 0;
    margin: 0;
    min-height: 100px;
}

/* ------------------------------- ARTISTS SINGLE STORY --------------------- */

.wallImg img {
    width: 100%;
    height: auto;
    display: block;
}
.artistsStoryContent {
    margin-top: -240px;
}
.artistsStoryContent .smallerContainer {
    padding: 40px 50px 0;
    background-color: #fff;
    position: relative;
    max-width: 1124px;
}
.artistsStoryContent h1.storyTitle {
    border: none;
    margin-top: 0;
    padding-top: 0;
    padding-right: 220px;
    margin-bottom: 35px;
}
.artistsStoryContent .story-wrapper .addthis_toolbox:nth-of-type(1) {
    position: absolute;
    top: 47px;
    right: 50px;
}

/* ------------------------------ NEMA NA STANJU ---------------------------- */

a.nemaNaStanju {
    opacity: 0.2;
    pointer-events: none !important;
}
.secondInfo {
    position: relative;
}
.secondInfo #js-quantity-message {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    padding-top: 5px;
    color: #EB001B;
}
.basketWrapper #js-quantity-message {
    color: #EB001B;
    font-weight: 600;
    margin-bottom: 5px;
}