/*LaptopShop.ba - CSS V1.2.5*/
@font-face { font-family: "DM Sans", sans-serif; font-weight: normal; font-style: normal; }
html, body { font-family: "DM Sans", sans-serif; --scrollbarBG: #eaeaea; --thumbBG: #eaeaea; font-size:16px;color:#111; background-color:#fff; line-height:1.75; }
html, body { --scrollbarBG: #eaeaea!important; --thumbBG: #eaeaea!important; }
html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
body { margin:0; scrollbar-width: thin; scrollbar-color: #eaeaea; }
body::-webkit-scrollbar-track { background: #fff; }
body::-webkit-scrollbar-thumb { background-color: var(--thumbBG); border-radius: 6px; border: 3px solid #eaeaea; }
body::-webkit-scrollbar { width: 14px; }
a { background-color: transparent; }
a:active, a:hover { outline: 0; }
a:focus { color: #111; text-decoration: underline; outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
dfn { font-style: italic; }
h1, h2, h3, h4, h5, h6 { font-family: "DM Sans", sans-serif; margin-bottom:10px; margin-top:0; font-weight:700; }
mark { background:#ff0;color:#000; }
small { font-size:80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
img { border: 0; }
svg:not(:root) { overflow: hidden; }
figure { margin: 1em 40px; }
hr { box-sizing:content-box;height:0; }
pre { overflow:auto; }
code,kbd,pre,samp { font-family:monospace, monospace;font-size:1em; }
.btn:hover, .btn:focus, .btn.focus { color:#fff; }
button,input,optgroup,select,textarea { color:inherit;font:inherit;margin:0; }
button { overflow:visible; }
button,select{text-transform:none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
fieldset { border:0;margin:0;padding:0; }
legend { border:0;padding:0; }
textarea { overflow:auto; }
optgroup { font-weight:700; }
/*thead { background:#1f1f1f; }*/
table { border-collapse:collapse;border-spacing:0; }
table a { color:#111; }
td,th { font-size: 14px;padding:0; }
:focus{outline:none; }
input,textarea,select { border-radius:0; }
select::-ms-expand { display:none; }
img { display:block; }
ul,ol,li { list-style:none; }
p { margin:0 0 12px; }
figure { margin:0; }
.click:hover { text-decoration: none; }
*,:before,:after{box-sizing:border-box;margin:0;padding:0; }
html.menu-open,body.menu-open { overflow:hidden; }
img { height:auto;display:block;max-width:100%; }
.korpabtn { background:#fff!important; color:#111!important; border-color:#111; border-radius: 25px; font-size: 14px; font-weight: normal; margin-top: 5px; padding-top: 16px!important; }
.korpabtn:active, .korpabtn:hover { background:#fff;color:#111; border-color:#ddd; opacity: 0.8; }
#theme-toggle:hover { cursor: pointer; }
body.theme-light #theme-toggle::before { content: 'Dark '; }
body.theme-dark #theme-toggle::before { content: 'Light '; }
.clear { clear:both;visibility:hidden;line-height:0;height:0; }
.contrast-dropdown { position: relative; float: left; top: 2px; margin-right: 10px; }
.contrast-dropdown:hover .not-supported { display: block; min-width: 260px; color: #333; font-size: 14px; line-height: 1.7; }
@supports (filter:grayscale(100%)) {
    .contrast-dropdown:hover .not-supported { display: none; }
}
.contrast-dropdown-btn { pointer-events: none; }
@supports (filter:grayscale(100%)) {
    .contrast-dropdown-btn {
        pointer-events: auto;
    }
}
.contrast-dropdown-list {
    position: absolute;
    top: 30px;
    left: -15px;
    display: none;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .16);
    background: #fff;
    padding: 8px 0;
    z-index: 1
}
.contrast-dropdown-list:before {
    content: "";
    position: absolute;
    top: -9px;
    left: 20px;
}
.contrast-dropdown-list.open {
    display: block;
    min-width: 150px; background-color: transparent;
}
.contrast-dropdown-list button {
    position: relative;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 400; color:#333;
    min-width: 160px;
}
.contrast-dropdown-list button.active {
    box-shadow: inset 4px 0 #ed1a3b;
    color: #ed1a3b;
    pointer-events: none
}
.not-supported {
    position: absolute;
    top: 30px;
    right: -15px;
    display: none;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .16);
    background: #fff;
    padding: 20px;
    z-index: 1
}
.not-supported:before {
    content: "";
    position: absolute;
    top: -9px;
    right: 22px;
    border-left: 11px solid transparent;
    border-right: 11px solid transparent;
    border-bottom: 10px solid #fff
}
.hide-bar .contrast-dropdown-list {
    display: none
}

[data-contrast="grayscale"] {
    filter: grayscale(100%);
}
[data-contrast="inverted"] {
    filter: invert(100%);
}
button.contrast-dropdown-btn.js-toggle-contrast-dd {
    background-color: transparent;
    border: none;
    margin: 7px;
    float: right;
}
html.grayscale .web-main-nav a {
    color: #ed1a3b!important
}
html.grayscale .web-main-nav a:hover {
    color: #000!important
}
html.inverted {
    filter: invert(100%)
}
@-moz-document url-prefix() {
    html.grayscale body, html.inverted body {
        height: 100%
    }
}

.contrast-dropdown { position: relative; float: right; top: 4px; margin-right: 0px; }
.contrast-dropdown:hover .not-supported { display: block; min-width: 260px; color: #333; font-size: 14px; line-height: 1.7; }
.contrast-dropdown-list button.active { box-shadow: inset 4px 0 #ed1a3b; color: #ed1a3b; pointer-events: none; }
@supports (filter:grayscale(100%)) {
    .contrast-dropdown:hover .not-supported { display: none; }
}
.text.muted { color:#d0d0d0; }
.modal-content { background:#222; }
.modal-header { border-bottom:1px solid #3b3b3b; padding: 0px; }
.modal-header h1 { color:#fff; font-size: 18px; }
.modal-header h2 { color:#fff; font-size: 16px; }
.modal-header .close { color:#fff;opacity:1; }
.my-account dl.dl-horizontal { width: 100%; border: 1px solid #ddd; border-radius: 5px; padding: 20px; }
.my-account .dl-horizontal dt { margin-top: 13px; min-height: 30px; margin-top: 13px; }
.firma a { margin: 10px; }

label.radio-inline.btn.btn-default.active, label.radio-inline.btn.btn-default { height: 30px; }

.row { margin-right:-10px;margin-left:-10px; }
.col-xs-1,.col-sm-1,.col-md-1,.col-lg-1,.col-xs-2,.col-sm-2,.col-md-2,.col-lg-2,.col-xs-3,.col-sm-3,.col-md-3,.col-lg-3,.col-xs-4,.col-sm-4,.col-md-4,.col-lg-4,.col-xs-5,.col-sm-5,.col-md-5,.col-lg-5,.col-xs-6,.col-sm-6,.col-md-6,.col-lg-6,.col-xs-7,.col-sm-7,.col-md-7,.col-lg-7,.col-xs-8,.col-sm-8,.col-md-8,.col-lg-8,.col-xs-9,.col-sm-9,.col-md-9,.col-lg-9,.col-xs-10,.col-sm-10,.col-md-10,.col-lg-10,.col-xs-11,.col-sm-11,.col-md-11,.col-lg-11,.col-xs-12,.col-sm-12,.col-md-12,.col-lg-12{ position:relative;min-height:1px;padding-left:15px;padding-right:15px; }
:focus{outline:none!important; }
.form-control:focus { box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 0, 0, .6); }
.btn-link:hover, .btn-link:focus { color: #fff; }
.page a, .page-block a { text-decoration: underline; }
.page-block { margin-bottom: 20px; } 
.btn { text-decoration: none !important; font-size: 14px; transition: 0.3s ease-in-out; }
.btn, .button { line-height: 1; cursor: pointer; box-shadow: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-align: center; white-space: nowrap; outline: 0 !important; color: #111; display: inline-block; height: 2.875rem; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; font-family: "DM Sans", sans-serif; border-radius: 0; padding: 0.9375rem 1.875rem; transition: 0.3s ease-in-out; }
.btn-default, .button--default { border: 1px solid #ddd; border-radius: 5px; background: transparent; transition: color 0.25s ease-in-out, border-color 0.25s ease-in-out, background-color 0.25s ease-in-out; margin-bottom: 0; padding: 0.9375rem 1.875rem; font-size: 14px; transition: 0.3s ease-in-out; }
.btn-default:after, .button--default:after { transition: 0.3s ease-in-out; background-image: url(/game_computer_store/img/angle-right-gray.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.btn-default:hover, .btn-default:focus, .btn-default:focus:active, .btn-default.is-focused, .button--default:hover, .button--default:focus, .button--default:focus:active, .button--default.is-focused { color: #f60; text-decoration: none; border-color: #f60; background-color: transparent; }
.btn-default:hover:after, .btn-default:focus:after, .btn-default:focus:active:after, .btn-default.is-focused:after, .button--default:hover:after, .button--default:focus:after, .button--default:focus:active:after, .button--default.is-focused:after { background-image: url(/game_computer_store/img/angle-right-red.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.btn-default:active, .btn-default.is-active, .button--default:active, .button--default.is-active { background-image: none; }
.btn-default:disabled, .btn-default.is-disabled, .button--default:disabled, .button--default.is-disabled { color: #999; background-color: #efefef; }
.btn-arrow, .btn--arrow {
    position: relative;
    padding-right: 2.9375rem;
    color: #fff;
    background-color: #007bff; /* or use your own bg */
    text-decoration: none;
    display: inline-block;
}

.btn-info { background:#ff6000;border-color:#ff6000; }
.btn-info:focus,.btn-info:active,.btn-info:focus:active,.btn-info:hover { background:#00b900;border-color:#00b900; }
.btn-white { color:#fff; font-size: 14px; border-radius: 25px; border-color: #00b900; background-color: #00b900; }
.btn-white:after { background-position:center;background-repeat:no-repeat;background-size: 100% 100%; }
.btn-white:hover { color:#fff; border-color: #00b900; background-color: #00b900; border-radius: 25px; opacity: 0.8; transition:.3s ease-in-out;}
.btn-white:hover:after { opacity: 0.8; transition:.3s ease-in-out; }

.btn-warning { color:#fff;background:#f37e01;border-color:#f37e01; }
.btn-success { border-color: #00b900; background-color: #00b900; border-radius:5px; box-shadow: inset 0 -2px 0 0 #090; }
.btn-success:focus,.btn-success:active,.btn-success:focus:active,.btn-success:hover { border-color: #00b900; background-color: #00b900; opacity:0.8; }
.btn-sec { background:#111;color:#fff; }
.btn-primary.disabled:hover,.btn-primary[disabled]:hover,.btn-primary:focus,.btn-primary:active,.btn-primary:focus:active,.btn-primary:hover { border-color: #00b900; background-color: #00b900; color:#fff; border-radius: 5px; opacity: 0.8; }
.primary.disabled:focus, .primary.disabled { background:#fff!important; border-color:#27ba7a!important; opacity: 0.5; transition:.3s ease-in-out;}
.btn-dark { background:#252525; }
.btn-dark:hover { color:#fff;background:#202020; }
.btn-md { font-weight:400;text-transform:none;font-size: 14px;padding:.875rem .9375rem; }

background-image:url(/game_computer_store/img/angle-right-white.svg);
.btn-md.btn-default, .btn-md.button--default { color: #111; }
.btn-md.btn-default:focus, .btn-md.btn-default:active, .btn-md.btn-default:focus:active, .btn-md.btn-default:hover, .btn-md.button--default:focus, .btn-md.button--default:active, .btn-md.button--default:focus:active, .btn-md.button--default:hover { color: #fff; }
.btn-sm, .btn-group-sm>.btn { line-height: 2; font-weight: 400; text-transform: none; font-size: 14px; padding: 0.4375rem 0.9375rem; }
.btn-sm.btn-default, .btn-group-sm>.btn-default.btn, .btn-sm.button--default, .btn-group-sm>.button--default.btn { color: #111; font-size: 14px; }
.btn-sm.btn-default:focus, .btn-group-sm>.btn-default.btn:focus, .btn-sm.btn-default:active, .btn-group-sm>.btn-default.btn:active, .btn-sm.btn-default:focus:active, .btn-group-sm>.btn-default.btn:focus:active, .btn-sm.btn-default:hover, .btn-group-sm>.btn-default.btn:hover, .btn-sm.button--default:focus, .btn-group-sm>.button--default.btn:focus, .btn-sm.button--default:active, .btn-group-sm>.button--default.btn:active, .btn-sm.button--default:focus:active, .btn-group-sm>.button--default.btn:focus:active, .btn-sm.button--default:hover, .btn-group-sm>.button--default.btn:hover { color: #111; }
.btn-xs, .btn-group-xs>.btn { font-weight: 400; height: 1.625rem; text-transform: none; font-size: 14px; padding: 0.375rem 1.25rem; }
.btn-block { width: 100% !important; display: block !important; }
@media only screen and (max-width: 767px) {
    .btn, .button { padding-right: 1.25rem; padding-left: 1.25rem; width: 100% !important; }
    .btn-white:after, .progress-container  { display: none; }
}
.line { float:right; }
.line h3.advanced-rate-title,.box-reviews .reivew-header h3 { margin:0; }
.link-print { margin-right:20px;line-height:35px;float:right; }
.ups { display:block;font-weight:400;color:#111;font-size: 14px;margin-top:10px; }
.ups:before { content:'\f058';font-family:FontAwesome;color:#00af56;font-size: 14px;margin-right:.3125rem; }
.infosliderBox .detail h3 { margin:0; }
.threecolumn_view { float:left!important;width:100%;margin:15px 0 20px!important; }
.noneRated { float:left;padding-top:40px; }
div[id^="tsbadgeResponsiveTop"] { position: fixed; top: -100px; }
.iconGoogleLogin,.iconFacebookLogin { margin-top:-1px; }
span.select>span.glyphicon-ok.text-success:before { display:block;margin-left:-60px; }
.dl-horizontal dt{float:left;clear:left;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.xdebug-error, .xe-notice, .cake-error, .cake-stack-trace { font-size: 14px; color:#e20814; }
.progress-container { width: 100%; height: 3px; background: #ddd; display: none; }
.progress-container.progress-container--fixed { display: block; }
.progress-bar-config { height: 3px; background: #e10717; width: 0%; }
.input-group-addon { color:#111;background-color:#ddd;border:1px solid #ddd;font-size: 13px; text-transform: uppercase; }
.filterBox .rangeSlider input { padding-right:0;font-size: 14px; border-radius: 0px; border-radius: 5px; }
.table-hover>tbody>tr:hover { background:#fff; }
form fieldset { border: 0 solid #ccc; border-radius: 0; padding: 0; }
form fieldset>:last-child { margin-bottom:0; }
form fieldset>p { margin-bottom:1.25rem;color:#111; }
form fieldset>p::after { clear:both;content:"";display:block; }
form legend { color: #333333; border: 0.0625rem solid #e5e5e5; border-radius: 0.3125rem; background: #fff; padding: 0.3125rem 0.625rem; }
form label { display:block;font-weight:400;color:#111;margin-bottom:.625rem;font-size: 14px; }
form label.is-radio,form label.is-checkbox { display:inline-block;height:2.8125rem;line-height:2.8125rem;font-weight:400;font-size: 14px;margin:0 .625rem 0 .0625rem; }
form label.is-checkbox { margin:0 .625rem; }
form label.is-error { display:inline-block;font-weight:400;color:#fff;border-radius:.1875rem;background:#d9534f;margin-top:.625rem;position:relative;font-size: 14px;padding:.3125rem .625rem; }
form label.is-error:before { display:block;content:'';width:0;height:0;border-left:.3125rem solid transparent;border-right:.3125rem solid transparent;border-bottom:.3125rem solid #d9534f;position:absolute;top:-.3125rem;left:.625rem; }
form .form-control, form button, form input, form select, form textarea { box-shadow: none; outline: none; display: block; border-radius: 5px; width: 100%; max-width: 100%; height: 2.8125rem; font-family: "DM Sans", sans-serif; color: #111; border: 0.0625rem solid #ddd; background: #fff; padding: 0.3125rem 0.9375rem; font-size: 14px; }
form .form-control::-webkit-input-placeholder,form button::-webkit-input-placeholder,form input::-webkit-input-placeholder,form select::-webkit-input-placeholder,form textarea::-webkit-input-placeholder,form .form-control::-moz-placeholder,form button::-moz-placeholder,form input::-moz-placeholder,form select::-moz-placeholder,form textarea::-moz-placeholder,form .form-control:-ms-input-placeholder,form button:-ms-input-placeholder,form input:-ms-input-placeholder,form select:-ms-input-placeholder,form textarea:-ms-input-placeholder,form .form-control::placeholder,form button::placeholder,form input::placeholder,form select::placeholder,form textarea::placeholder { color:#999; }
form .form-control:focus:not(:-moz-read-only):not([type='submit']):not([type='reset']):not([type='button']),form .form-control .is-focused,form button:focus:not(:-moz-read-only):not([type='submit']):not([type='reset']):not([type='button']),form button .is-focused,form input:focus:not(:-moz-read-only):not([type='submit']):not([type='reset']):not([type='button']),form input .is-focused,form select:focus:not(:-moz-read-only):not([type='submit']):not([type='reset']):not([type='button']),form select .is-focused,form textarea:focus:not(:-moz-read-only):not([type='submit']):not([type='reset']):not([type='button']),form textarea .is-focused,form .form-control:focus:not(:read-only):not([type='submit']):not([type='reset']):not([type='button']),form .form-control .is-focused,form button:focus:not(:read-only):not([type='submit']):not([type='reset']):not([type='button']),form button .is-focused,form input:focus:not(:read-only):not([type='submit']):not([type='reset']):not([type='button']),form input .is-focused,form select:focus:not(:read-only):not([type='submit']):not([type='reset']):not([type='button']),form select .is-focused,form textarea:focus:not(:read-only):not([type='submit']):not([type='reset']):not([type='button']),form textarea .is-focused { border-color:#ddd; }
form .form-control.is-error, form button.is-error, form input.is-error, form select.is-error, form textarea.is-error { border-color: #d9534f; }
form .form-control:disabled,form .form-control.is-disabled,form button:disabled,form button.is-disabled,form input:disabled,form input.is-disabled,form select:disabled,form select.is-disabled,form textarea:disabled,form textarea.is-disabled { opacity: 0.8;}
form .form-control[type='radio'],form .form-control[type='checkbox'],form button[type='radio'],form button[type='checkbox'],form input[type='radio'],form input[type='checkbox'],form select[type='radio'],form select[type='checkbox'],form textarea[type='radio'],form textarea[type='checkbox']{ height:auto;outline:none;display:inline-block;margin-right:.625rem;padding:0; }
form .form-control[readonly],form button[readonly],form input[readonly],form select[readonly],form textarea[readonly]{ box-shadow:none;color:#fff;background:transparent;border:.0625rem solid #ddd; }
form .form-control[readonly]::-webkit-input-placeholder,form button[readonly]::-webkit-input-placeholder,form input[readonly]::-webkit-input-placeholder,form select[readonly]::-webkit-input-placeholder,form textarea[readonly]::-webkit-input-placeholder,form .form-control[readonly]::-moz-placeholder,form button[readonly]::-moz-placeholder,form input[readonly]::-moz-placeholder,form select[readonly]::-moz-placeholder,form textarea[readonly]::-moz-placeholder,form .form-control[readonly]:-ms-input-placeholder,form button[readonly]:-ms-input-placeholder,form input[readonly]:-ms-input-placeholder,form select[readonly]:-ms-input-placeholder,form textarea[readonly]:-ms-input-placeholder,form .form-control[readonly]::placeholder,form button[readonly]::placeholder,form input[readonly]::placeholder,form select[readonly]::placeholder,form textarea[readonly]::placeholder { color:#999; }
form .form-control[readonly]:focus,form button[readonly]:focus,form input[readonly]:focus,form select[readonly]:focus,form textarea[readonly]:focus { color:#fff;background:transparent;border:.0625rem solid #ddd; }
form .form-control[type='radio'],form .form-control[type='checkbox'],form .form-control[type='submit'],form .form-control[type='reset'],form .form-control[type='button'],form button[type='radio'],form button[type='checkbox'],form button[type='submit'],form button[type='reset'],form button[type='button'],form input[type='radio'],form input[type='checkbox'],form input[type='submit'],form input[type='reset'],form input[type='button'],form select[type='radio'],form select[type='checkbox'],form select[type='submit'],form select[type='reset'],form select[type='button'],form textarea[type='radio'],form textarea[type='checkbox'],form textarea[type='submit'],form textarea[type='reset'],form textarea[type='button'],form button { display:inline-block;width:auto; }
form button,form input[type='submit'],form input[type='reset'],form input[type='button'],form button:hover,form input[type='submit']:hover,form input[type='reset']:hover,form input[type='button']:hover { color:#333;background-color:#efefef; }
form select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-repeat: no-repeat; background-position: right 0.625rem center; background-size: auto 0.3125rem; }
form select.primary { height: 2.5rem; color: dfdfdf; background-color: #000000; font-size: 14px; padding-right: 2rem; background-image: url(/game_computer_store/img/select-arrow-primary.png); background-position: right; background-repeat: no-repeat; background-size: 1.9375rem 2.5rem; }
form select.primary option { color:#fff; }
form textarea { width:100%;height:12.5rem; }
.ratio,audio,embed,iframe,object,video { margin-bottom:1.25rem; }
.ratio { display:block;overflow:hidden;height:0;position:relative;padding:0; }
.ratio embed,.ratio iframe,.ratio object,.ratio video{height:100%;width:100%;border:0;position:absolute;top:0;left:0; }
.ratio--16x9 { padding-bottom:56.25%; }
.ratio--4x3 { padding-bottom:75%; }
a { outline:none!important;color:#111;transition:.3s ease-in-out;text-decoration:none; }
a:hover { color:#111;text-decoration:underline; }
a:focus{text-decoration:none; }
.badge.badge-success { background:#29cb85; }
ul,li { list-style:none; }
ul,ol { margin-top:0;margin-bottom:12px; }
ul ul,ul ol,ol ul,ol ol { margin-bottom:0; }
.select2-container--bootstrap .select2-selection--single .select2-selection__rendered { color:#111;padding:6px 0; }
.select2-dropdown { background-color:#090909; }
.select2-selection.select2-selection--single, select { font-family: "DM Sans", sans-serif; font-weight: 400;font-size: 14px; border: 1px solid #ddd; border-top: none; cursor: pointer; background: #fff; box-shadow: none !important; border-radius: 0 !important; box-shadow: none; outline: none; display: block; width: 100%; max-width: 100%; height: 2.8125rem; font-family: "DM Sans", sans-serif; color: #111!important; border: 0.0625rem solid #ddd; border-radius: 0; padding: 0.3125rem 0.9375rem; font-size: 14px; }
.select2-container--bootstrap.select2-container--focus .select2-selection,.select2-container--bootstrap.select2-container--open .select2-selection { border-color:inherit; }
.text-success,.text-usp i { color:#29cb85; }
.text-usp { color:#111; }
@media only screen and (max-width: 479px) {
    .text-usp { width:100%; display: block; }
}
.btn-sm,.btn-group-sm>.btn { font-size: 14px;line-height:0.9;padding:8px 16px; }
.btn-default { border: 1px solid #ddd;background:transparent;transition:color .25s ease-in-out, border-color .25s ease-in-out, background-color .25s ease-in-out;margin-bottom:0;font-size:1rem;padding:.9375rem 1.875rem; }
.btn-success { color:#fff; border-color: #00b200; background-color: #00b200; }
.btn-success:active:hover,.btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active:hover,.open>.dropdown-toggle.btn-success:hover,.btn-success:active:focus,.btn-success.active:focus,.open>.dropdown-toggle.btn-success:focus,.btn-success:active.focus,.btn-success.active.focus,.open>.dropdown-toggle.btn-success.focus { color:#fff;border-color: #00b200; background-color: #00b200; opacity: 0.8; }
.dropdown.open>.dropdown-backdrop { z-index:0; }
.btn-info { background:#fff; }
.btn-warning { background:#ff6348; }
.btn-warning:hover { background:#ff9f17;color:#fff; }
.btn-primary { font-size: 14px; border-color: #00b900; background-color: #00b900; color:#fff; border-radius: 5px; min-height: 45px; font-weight: 700; box-shadow: inset 0 -2px 0 0 #090; min-height: 45px; }
.btn-primary:active:hover,.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active:hover,.open>.dropdown-toggle.btn-primary:hover,.btn-primary:active:focus,.btn-primary.active:focus,.open>.dropdown-toggle.btn-primary:focus,.btn-primary:active.focus,.btn-primary.active.focus,.open>.dropdown-toggle.btn-primary.focus { color:#fff; border-color: #00b200; background-color: #00b200; }
.help-block { display: block; margin-top: 5px; margin-bottom: 10px; color: #737373; width: 100% !important; float: left; line-height: 20px; text-align: left; font-size: 12px; }

.alert { z-index:999;margin-top:30px; margin-left: 320px; margin-right: 320px; }
.alert-success { margin-top:40px; }
@media only screen and (max-width: 479px) {
    .alert { z-index:999; margin-top:85px; margin-left: 15px; margin-right: 15px; margin-bottom: 0px; }
}

.ui-slider{ position:relative;text-align:left; }
.ui-slider .ui-slider-handle{ position:absolute;z-index:2;width:1.2em;height:1.2em;cursor:default; }
.ui-slider .ui-slider-range{ position:absolute;z-index:1;font-size:.7em;display:block;border:0;background-position:0 0; }
.ui-slider.ui-state-disabled .ui-slider-handle,.ui-slider.ui-state-disabled .ui-slider-range{filter:inherit; }
.ui-slider-horizontal{height:.8em; }
.ui-slider-horizontal .ui-slider-handle{top:-.3em;margin-left:-.6em; }
.ui-slider-horizontal .ui-slider-range{top:0;height:100%; }
.ui-slider-horizontal .ui-slider-range-min{left:0; }
.ui-slider-horizontal .ui-slider-range-max{right:0; }
.ui-slider-vertical { width:.8em;height:100px; }
.ui-slider-vertical .ui-slider-handle{left:-.3em;margin-left:0;margin-bottom:-.6em; }
.ui-slider-vertical .ui-slider-range{left:0;width:100%; }
.ui-slider-vertical .ui-slider-range-min{bottom:0; }
.ui-slider-vertical .ui-slider-range-max{top:0; }
.slick-slider{ position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent; }
.slick-list{ position:relative;display:block;overflow:hidden;margin:0;padding:0; }
.slick-list:focus{outline:none; }
.slick-list.dragging{cursor:hand; }
.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0); }
.slick-track{ position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto; }
.slick-track:before,.slick-track:after { display:table;content:''; }
.slick-track:after { clear:both; }
.slick-slide { display:none;float:left;height:100%;min-height:1px; }
[dir='rtl'] .slick-slide { float:right; }
.slick-slide.dragging img { pointer-events:none; }
.slick-vertical .slick-slide { display:block;height:auto;border:1px solid transparent; }
.slick-loading .slick-track,.slick-loading .slick-slide{visibility:hidden; }
.slick-slide img,.slick-initialized .slick-slide { display:block; }
.slick-slide.slick-loading img,.slick-arrow.slick-hidden { display:none; }
.r-tabs .r-tabs-nav { margin:0;padding:0; }
.r-tabs .r-tabs-tab { display:inline-block;list-style:none;margin:0; }
.r-tabs .r-tabs-panel { display:none;padding:15px; }
.r-tabs .r-tabs-panel.r-tabs-state-active { display:block; }
.table-bordered { border-radius: 5px; }
.table-bordered > thead > tr > th,.table-bordered > tbody > tr > th,.table-bordered > tfoot > tr > th,.table-bordered > thead > tr > td,.table-bordered > tbody > tr > td,.table-bordered > tfoot > tr > td { border:1px solid #ddd; border-radius:5px; }
.r-tabs .r-tabs-accordion-title,.disabled { display:none; }
@media only screen and (max-width: 768px) {
    .r-tabs .r-tabs-nav,.r-tabs .r-tabs-accordion-title { display:block;max-width:100%; margin-bottom: 20px; }
}

@media only screen and (max-width: 320px) {
    .r-tabs .r-tabs-nav,.r-tabs .r-tabs-accordion-title { margin-bottom: 0px; }
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary { display:block; }
audio,canvas,progress,video { display:inline-block;vertical-align:baseline; }
audio:not([controls]) { display:none;height:0; }
[hidden],template { display:none; }
.wrapper { z-index: 9; overflow: hidden; background-color: #fff; transition: 0.3s ease-in-out; position: relative; font-size: 14px; padding-top: 112px; }
@media only screen and (max-width: 648px) {
    .wrapper { padding-top:0px!important; }
}
@media only screen and (max-width: 767px) {
    html,body { font-size: 14px; }
    .wrapper { padding-top:0px!important; }
}
@media only screen and (max-width: 1024px) {
    html,body { font-size: 14px; }
    .wrapper { padding-top:0px!important; }
}
@media only screen and (max-width: 1399px) {
    .wrapper { padding-top:0px!important; }
}
@media only screen and (max-width: 1199px) {
    .wrapper { padding-top:0px!important; }
}
.menu-open .wrapper { -webkit-transform: translateX(-250px); transform: translateX(-250px); position:relative;}


/* Dark Header */
.desktop-header {
    background-color: transparent;
    color: #111;
    display: block;
    position: absolute;
    z-index: 1001;
    margin-left: 230px;
    margin-top: 10px;
}

.main-nav {
    display: flex;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
}

.nav-list {
    list-style: none;
    display: flex;
    align-items: center;
}

.nav-item {
    /* No position:relative needed here anymore for dropdown */
}

.nav-link {
    font-family: "DM Sans", sans-serif;
    display: flex;
    align-items: center;
    padding: 9px 8px;
    text-decoration: none;
    color: #fff;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 13px;
    transition: color 0.2s ease, background-color 0.2s ease;
    border-bottom: 3px solid transparent;
    cursor: pointer; /* Indicate it's clickable/hoverable for menu */
}

.nav-link:focus { color:#fff; opacity: 0.7; }

.nav-link:hover,
.nav-item.active .nav-link { /* 'active' class will be set by JS on parent nav-item */
    color: #fff;
    text-decoration: none;
    opacity: 0.7;
}

.dropdown-arrow-svg {
    width: 1em; /* Adjust size relative to font-size of parent */
    height: 1em;
    margin-left: 8px;
    fill: #fff;
    opacity: 0.7;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), fill 0.2s ease; /* Smooth transition for rotation and color */
    vertical-align: middle; /* Helps align with text better */
}

.nav-link:hover .dropdown-arrow-svg,
.nav-item.active .nav-link .dropdown-arrow-svg { /* Target SVG within active/hovered link */
    fill: #ffffff;
    opacity: 1;
}

.nav-item.active .nav-link .dropdown-arrow-svg { /* Rotate arrow when menu is open */
    /*transform: rotate(180deg);*/
    opacity: 1;
}

.static-mega-menu-container {
    display: none; 
    position: absolute;
    top: 60px; /* Your existing value */
    left: 0; /* Relative to .desktop-header */
    width: 100%; /* Relative to .desktop-header */
    background-color: #fff; /* Your existing light theme */
    color: #111; /* Your existing light theme */
    box-shadow: 0 8px 20px rgba(0,0,0,0.12); /* Slightly adjusted shadow for softness */
    z-index: 1000;
    
    opacity: 0;
    visibility: hidden;
    /* Enhanced transform: starts slightly higher and scaled down on Y-axis */
    transform: translateY(-10px) scaleY(0.97); 
    transform-origin: top center; /* Ensures scaling happens from the top */
    
    /* Using your chosen easing function and duration */
    transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), 
                visibility 0.35s cubic-bezier(0.4, 0, 0.2, 1), 
                transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 300px; /* Keep or adjust as needed */
}

.static-mega-menu-container.visible {
    display: block; 
    opacity: 1;
    visibility: visible;
    /* Final state: full scale and correct Y position */
    transform: translateY(0) scaleY(1); 
}
.mega-menu-content-wrapper {
    max-width: 1200px;
    min-height: 375px;
    margin: 0 auto;
    padding: 30px 20px;
    position: relative; /* For positioning the close button */
}

.mega-menu-close-btn {
    position: absolute;
    top: 20px;
    right: 25px;
    background: none;
    border: none;
    color: #a0a0a0;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    padding: 5px;
    transition: color 0.2s ease;
}

.mega-menu-close-btn:hover {
    color: #111;
}

/* Content Panels within the Static Container */
.mega-menu-content-panel {
    display: none; /* Hidden by default, shown by JS */
}

.mega-menu-content-panel.active {
    display: block; /* Or 'flex' if its internal .mega-menu-main-area needs it */
}

/* Styles for .mega-menu-main-area, .mega-menu-links-area, .mega-menu-column, etc. 
   remain largely the same as the previous "Sony Style" CSS. */

.mega-menu-main-area {
    display: flex;
    gap: 30px;
}

.mega-menu-links-area {
    display: flex;
    flex-grow: 1;
    gap: 25px;
}

.mega-menu-column {
    flex: 1;
    min-width: 180px;
}

.column-title {
    font-size: 14px;
    font-weight: 900;
    color: #111;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f0f0f0;
    letter-spacing: 0.2px;
}

.link-list {
    list-style: none;
}

li.ljetni-popusti {  
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 13px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60 !important;
    display: inline-block;
    padding: 0px;
    margin-bottom: 10px;
    border: none !important;
    padding-bottom: 0px!important;
    margin-left: 0px;
    width: 90%;
    text-align: center;
}

li.ljetni-popusti a { color: #f60!important; }  


li.kombo-ponude {  
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 13px;
    line-height: 21px;
    background-color: #c1e8ff;
    border-radius: 5px;
    color: #0090e2!important;
    display: inline-block;
    padding: 0px;
    border: none !important;
    padding-bottom: 0px!important;
    margin-left: 0px;
    width: 90%;
    text-align: center;
    margin-top: 5px;
}

li.kombo-ponude a { color: #0090e2!important; }  

.link-list li {
    margin-bottom: 0px;
}

.link-list li a {
    display: block;
    padding: 0px;
    text-decoration: none;
    color: #111;
    font-size: 14px;
    transition: color 0.2s ease, padding-left 0.2s ease;
}

.link-list li a:hover {
    color: #0090e2;
    padding-left: 3px;
}

.mega-menu-side-promo {
    flex-basis: 280px;
    flex-shrink: 0;
    padding-left: 25px;
    border-left: 1px solid #f0f0f0;
}

.promotion-link-sidebar p {
    color: #111 !important;
    text-decoration: none;
}

.promotion-link-sidebar p:hover {
    text-decoration: none;
}

.side-promo-image {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin-bottom: 10px;
    background-color: #fff;
}

.mega-menu-bottom-banner {
    margin-top: 30px;
    padding-top: 25px;
    border-top: 1px solid #f0f0f0;
}

.mega-menu-bottom-banner img {
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;
    border: 1px solid #f0f0f0;
}

/* Hide on mobile */
@media (max-width: 991.98px) {
    .desktop-header, .static-mega-menu-container {
        display: none;
    }
}

.header { width: 100%; z-index: 9999; position: fixed; top: 0; left: 0; background: #285dab; }
.header .theme-light { background: #ffffff; }
.header form { float: right; max-width: 130px; position: relative; margin-top: 9px; margin-right: 30px; z-index: 11!important; }
.header__logo img { transition: 0.3s ease-in-out; }
.header__menu { float: left; transition: 0.3s ease-in-out; margin-left: -0.5rem; padding: 16px 0px 0px 40px; }
.header__menu .dropdown-menu { top: 94px; }
.header--fixed .header__menu .dropdown-menu { top: 50px; }
.header--fixed { background-color: #285dab;}
.header__menu .dropdown-menu ul { line-height:30px; }
.header__menu .dropdown-menu > li > a { line-height:28px; }
.header form input[type="text"] { width: 100%; height: 2.5rem; background:#fff; padding: 0.3125rem 3.125rem 0.3125rem 0.9375rem; border-radius: 20px; color: #111; border: 1px solid #fff; }
.header form input[type="text"]::-webkit-input-placeholder, .header form input[type="text"]::-moz-placeholder, .header form input[type="text"]:-ms-input-placeholder, .header form input[type="text"]::placeholder { color: #ffffff; }
.header form button[type="submit"] { height: 100%; border: 0 none; overflow: hidden; width: 2.75rem; text-indent: -9999px; background-color: transparent; position: absolute; top: 0; right: 0; background-image: url(/game_computer_store/img/search.svg); background-position: center; background-repeat: no-repeat; background-size: 15px 15px; }
.header__logo { width: 240px; float: left; display: block; max-width: 300px; background-position: center; background-repeat: no-repeat; background-size: 100%; margin: 16px 0px 0px 0px; }
.support-header { float: right; transition: 0.3s ease-in-out; margin-left: -0.5rem; padding: 0px 20px 0px 0px; }
.support-header p, .support-header strong { font-size: 13px; }
.support-header a { font-size: 13px;color:#fff; }
.support-header a:hover { color:#fff;text-decoration:underline; }
.support-header .phone { float:left;margin-top:19px;line-height:17px;margin-right:20px;min-width:150px; }
.support-header .phone:before { content: ''; display: block; width: 25px; height: 25px; position: relative; top: 4px; left: 0px; background-image: url(/game_computer_store/img/phone.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; float: left; margin-right: 10px; }
.support-header .mail { float:left;margin-top:13px;line-height:17px;min-width:130px; color:#fff; }
.support-header .mail:before { content: ''; display: block; width: 23px; height: 25px; position: relative; top: 4px; left: 0px; background-image: url(/game_computer_store/img/mail.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; float: left; margin-right: 10px; }
.sticky-header { width: 100%; } 

@media only screen and (max-width: 479px) {
    .header__logo{ max-width:180px!important; margin-top:11px; }
    .sticky-header { display: block; margin-top:9px; }
    .infostickyBox h4 { font-size: 14px;}
    .footer .footer__main form button { width:150px!important; }
    .help-block { text-align:left; }
    .support-header,.latest { display:none; }
    .contrast-dropdown { float: left!important; }
    .hide-mobile { display: none!important; }
}
@media only screen and (max-width: 1024px) {
    .header { min-height: 44px; }
    .header__logo { -webkit-transform: translateX(-50%);transform: translateX(-50%);position: absolute; top: 0px; left: 49%;max-width: 230px; }
    .support-header, .header__menu { display: none; }
}
@media only screen and (min-width: 1024px) {
    .header__logo { max-width: 300px; }
}
@media only screen and (max-width: 1399px) {
    /*.header { padding-top:18px; }*/
    .header__menu { padding-bottom:1.5625rem;padding-left:1.875rem; }
    .header__menu>ul>li>.dropdown-item>a,.header__menu>ul>li>a { font-size: 14px; }
}
@media only screen and (max-width: 1199px) {
    .header form{max-width:12.5rem; }
    .header__menu>ul>li { margin-right:.3125rem;margin-left:.3125rem; }
    .header__menu>ul>li>.dropdown-item>a,.header__menu>ul>li>a { font-size: 14px; }
    .header__menu { padding-bottom:1.5625rem;padding-left:1.5625rem; }
}

@media only screen and (max-width: 320px) {
    .header__logo{ max-width:150px!important; margin-top:11px; }
}

.header__menu>ul { margin:0; }
.header__menu>ul>li { position:static;display:inline-block;margin-right:.4375rem;margin-left:.4375rem; }
.header__menu>ul>li:first-child { margin-left:0; }
.header__menu>ul>li:last-child { margin-right:0; }
.header__menu>ul>li>.dropdown-item>a,.header__menu>ul>li>a { font-weight:700;text-transform:uppercase;color:#ebebeb; padding-bottom:.125rem;font-size:14px;  }
.header__menu .dropdown-item:hover .dropdown-item-menu { display:block; }
.header__menu>ul>li>.dropdown-item:hover>a,.header__menu>ul>li>.dropdown-item>a:hover,.header__menu>ul>li>a:hover,.header__menu>ul>li.is-active>.dropdown-item>a,.header__menu>ul>li.is-active>a { color:#f60; }
.header__menu .dropdown-item-menu { z-index: 99; display: none; position: absolute; left: 0px; top: 89px; overflow: hidden; padding: 30px 30px 20px 30px;  width: 100%; border: 1px solid #333333; background: #252525; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.header__menu .dropdown-item-menu h4 { padding-bottom:15px;font-size: 14px;color:#fff;font-weight:700;text-transform:uppercase;margin:0; }
.header__menu .dropdown-item-menu .col1 { width:28%;float:left; }
.header__menu .dropdown-item-menu .image { overflow:hidden;width:260px;border:6px solid #3c3c3c;padding:10px; }
.header__menu .dropdown-item-menu .image strong { font-size: 14px;color:#fff;text-transform:uppercase; }
.header__menu .dropdown-item-menu .image .img { text-align:center;width:100%;padding:24px 0; }
.header__menu .dropdown-item-menu .image .img img { display:inline-block;width:100%; }
.header__menu .dropdown-item-menu .image .discount { width:78px;height:34px;font-size: 14px;color:#fff;text-align:center;float:left;line-height:34px;display:block;background:#f60; }
.header__menu .dropdown-item-menu .image .price { width:107px;height:34px;line-height:32px;border:1px solid #f8f8f8;font-size: 14px;color:#fff;font-weight:700;display:block;text-align:center;float:right; }
.header__menu .dropdown-item-menu .col2 { width:36%;float:left; }
.header__menu .dropdown-item-menu .link { width:50%;float:left; }
.header__menu .dropdown-item-menu .link ul { margin-bottom:15px;list-style:none;padding:0; }
.header__menu .dropdown-item-menu .link li { line-height:30px;width:100%; }
.header__menu .dropdown-item-menu .link li>a { font-family: "DM Sans", sans-serif;font-size: 14px;color:#fff;text-decoration:none;font-weight:400;text-transform:capitalize;border:none;background:transparent;padding:0; }
.header__menu .dropdown-item-menu .link li a:hover { text-decoration:underline;border:none; }
.header__menu .dropdown-item-menu p { font-size: 14px;line-height:28px; }
.header__menu>ul>li>.dropdown-item:hover { height:100px; }
.header__user,.header__tel { float:right;line-height:normal;display:inline-block;color:#fff;position:relative;font-size: 14px;margin-top: 11px; margin-left: 15px; margin-bottom: 10px; padding:10px; }

.dropdown-menu { 
    z-index: 1000;
    position: fixed;
    display: none;
    min-width: 230px;
    max-width: 253px;
    width: 100%;
    padding: 10px;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border-radius: 3px;
    -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    float: left;
    left: 587px;
    top: 50px;
}

.dropdown-menu li { text-align:left; }
.header__menu.mainmain li { text-align:left; }
.header__menu.mainmain li.racunari-menu { color:#eaeaea;}
.header__menu.mainmain li.racunari-menu a span.menu-icon { display: none; }

li#search-tab {
    background: #fff;
    color: #111;
}
li#search-tab a {
    color: #111;
}

li.search-tab-active.active a { background:#fff;}

/* Styles for Search Result Items List (Parent Container) */
.product-search-results-grid { /* This class is on the .row that wraps your search tiles */
    /* display: flex; /* This is already handled by .row from Bootstrap */
    /* flex-wrap: wrap; */
    /* margin-left: -10px; /* Adjust to counteract column padding if needed */
    /* margin-right: -10px; */
}

.product-grid-item-wrapper { /* This is the col-md-4 etc. div wrapping each search_tile */
    margin-bottom: -10px; /* Spacing between rows of items */
    display: flex; /* Make column a flex container to stretch the tile if needed */
}

div#panel-main {
    padding: 20px;
}

/* Main wrapper for one search result item */
.search-result-item {
    display: flex;
    align-items: flex-start; /* Align items to the top */
    width: 100%; /* Tile takes full width of its grid column wrapper */
    padding: 15px;
    background-color: #ffffff;
    border: 1px solid #e9ecef; /* Lighter border */
    border-radius: 6px;
    transition: box-shadow 0.25s ease-in-out, transform 0.25s ease-in-out;
    text-decoration: none; /* If the whole item becomes a link */
    margin-top: 20px; 
}

.row.product-search-results-grid {
    padding: 0px;
}

.search-result-item:hover {
    /*box-shadow: 0 6px 15px rgba(0,0,0,0.1);*/
    /*transform: translateY(-2px);*/
}

.search-result-item .sri-image-column {
    flex: 0 0 70px; /* Fixed width for image */
    margin-right: 15px;
    margin-top: -10px;
}

.search-result-item .sri-image-link {
    display: block;
}

.search-result-item .sri-image {
    width: 70px;
    height: 70px;
    object-fit: contain; /* Ensures whole image is visible without cropping */
    border-radius: 4px;
    background-color: #f8f9fa; /* Light background for images */
    /*border: 1px solid #f0f0f0;*/
}

.search-result-item .sri-details-column {
    flex-grow: 1; /* Takes up available space */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Align content to top */
    min-height: 70px; /* Align with image height for better vertical rhythm */
}

.search-result-item .sri-title {
    margin: 0 0 6px 0;
    font-size: 0.9375rem; /* 15px */
    font-weight: 900;
    line-height: 1.3;
    color: #007bff; /* Your primary link color */
}

.search-result-item .sri-title a {
    color: inherit;
    text-decoration: none;
}

.search-result-item .sri-title a:hover {
    text-decoration: underline;
    color: #0056b3; /* Darker shade on hover */
}

.search-result-item .sri-meta { /* For SKU or short description */
    font-size: 0.75rem; /* 12px */
    color: #6c757d; /* Grey text */
    margin-bottom: 8px;
    line-height: 1.4;
}

.search-result-item .sri-price {
    font-size: 1rem; /* 16px */
    font-weight: 700;
    color: #111; /* Darker price color */
    margin-top: auto; /* Pushes price to the bottom of the details column if content above varies */
    padding-top: 5px; /* Space above price */
    text-transform: uppercase;
}

.search-result-item .sri-old-price {
    font-size: 0.8125rem;
    color: #6c757d;
    text-decoration: line-through;
    margin-left: 0px;
    font-weight: normal;
    text-transform: uppercase;
}

.search-result-item .sri-action-column {
    flex: 0 0 auto; /* Takes only needed width for button */
    margin-left: 15px;
    display: flex;
    align-items: center; /* Vertically center button with details */
    justify-content: flex-end; /* Align button to the right */
    min-height: 70px; /* Align with image height */
}

.search-result-item .sri-view-btn {
    font-size: 14px; 
    padding: 6px 12px;
    font-weight: 500;
    white-space: nowrap;
    /* Using your theme's btn-outline-primary or similar */
}

/* Optional Add to Cart Button Styling if you implement it */
.search-result-item .sri-add-to-cart-form {
    margin: 0;
}
.search-result-item .sri-cart-btn {
    padding: 6px 10px; /* Make it compact */
    /* Add more styling if needed */
}
.search-result-item .sri-cart-btn svg.icon--cart { /* Style your cart SVG */
    width: 16px;
    height: 16px;
    fill: white;
}

.search-result-item .sri-image-column .akcija-product {
    position: absolute;
    margin-left: 2px;
    margin-top: -6px;
}

.search-result-item .sri-image-column .label {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 13px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60;
    display: inline-block;
    padding: .2rem .4rem .4rem;
}

div#panel-main-ajax {
    padding: 30px;
}

/* Styles for the search form when it's inside the mobile menu */
.mobile #mobileSearchHolder {
    padding: 10px 15px; /* Padding around the search form in the mobile menu */
    border-bottom: 1px solid #e9ecef; /* Optional separator line */
}

.mobile #mobileSearchHolder #searchForm {
    display: flex; /* Align input and button if button is visible */
    width: 100%;
}

.mobile #mobileSearchHolder input#searchq { /* The search input field */
    flex-grow: 1; /* Input takes available space */
    height: 40px;
    font-size: 14px;
    padding: 0 15px; /* Padding inside the input */
    border: 1px solid #ced4da;
    border-radius: 20px; /* Keep your rounded style */
    /* If you have a visible search button, adjust border-radius for input and button */
    /* e.g., border-radius: 20px 0 0 20px; */
}

.mobile #mobileSearchHolder #searchForm button[type="submit"] {
    /* Your current frontend search form button is styled by CSS to be an icon.
       For live search, the button becomes less critical.
       You can choose to hide it, or style it as a small icon button if you keep it. */
    display: none; /* Simplest: hide the button since search is live on input */
    /*
    // If you want to show it as an icon button:
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    text-indent: -9999px; // Hide text
    background-image: url(/game_computer_store/img/search.svg); // Your search icon
    background-position: center;
    background-repeat: no-repeat;
    background-size: 16px 16px; // Adjust icon size
    background-color: transparent;
    border: 1px solid #ced4da;
    border-left: none;
    border-radius: 0 20px 20px 0;
    cursor: pointer;
    */
}

.dropdown-menu > li > a { display:block;clear:both;font-weight:400;color:#0090e2;white-space:nowrap;line-height:21px;padding:3px 10px; font-weight: normal; }
.dropdown-menu > li > a:hover,.dropdown-menu > li > a:focus { color:#fff; text-decoration:none; background-color:#0090e2; font-weight: normal; }
li.dropdown.has-sub { color: rgba(0, 0, 0, 0);content: ''; display: block; background-position: center; background-repeat: no-repeat; background-size: 100% 100%; width: 100%; }

.header__user:before, .header__cart:before, .header__tel:before { content: ''; display: block; width: 20px; height: 20px; position: absolute; top: -2px; left: -2px; background-image: url(/game_computer_store/img/user.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.header__user:focus, .header__cart:focus, .header__tel:focus, .header__user:hover, .header__cart:hover, .header__tel:hover { color: #fff; }

.header__cart { padding-left: 1.625rem; float:right;line-height:normal;display:inline-block;color:#fff;position:relative;font-size: 14px;margin-top: 18px; margin-left: 10px; margin-bottom: 10px; padding:10px; }
.header__cart:before { width: 23px; height: 23px; position: absolute; top: 6px;  left: -3px; background-image: none; background-position: center; background-repeat: no-repeat; background-size: 20px; }

.header__cart { background-image:url(/game_computer_store/img/cart.svg)!important; background-position:center;background-repeat:no-repeat; }
.header__cart-1 { background-image:url(/game_computer_store/img/cart-1.svg)!important; }
.header__cart-2 { background-image:url(/game_computer_store/img/cart-2.svg)!important; }
.header__cart-3 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }
.header__cart-4 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }
.header__cart-5 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }
.header__cart-6 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }
.header__cart-7 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }
.header__cart-8 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }
.header__cart-9 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }
.header__cart-10 { background-image:url(/game_computer_store/img/cart-3.svg)!important; }

.header__cart span { 
    text-indent: 0;  
    display: block; 
    width: 23px; 
    height: 23px; 
    /*border-radius: 50%; 
    border: 2px solid #fff; */
    text-align: center; 
    line-height: 20px; 
    color: #fff;
    /*background: #29cb85; */
    font-size: 10px; 
    position: absolute; 
    top: -0.0625rem; 
    left: 0.625rem;
    -webkit-transform: translateY(-50%); 
    transform: translateY(-50%);
}
    
.header__tel { display: none; background-image: url(/game_computer_store/img/tel-icon.svg); background-position: center; background-repeat: no-repeat; background-size: 55% 55%; }
.header__sub { transition: 0.3s ease-in-out; background: #f2f7fc; padding-top: 8px; }
.header__top {  transition: 0.3s ease-in-out;background:#111;padding-top:0; }
.header__top .header__akcije { float:left;padding-top:10px; }
ul.header__akcije { float: left; }
.header__top .header__akcije li a { text-decoration:underline; }
.header__top .header__kontakt { float:right;padding-top:10px; }
.header__top .header__kontakt a { font-size: 14px;color:#dbdbdb; }
.header__top .header__kontakt a:hover { color:#fff;text-decoration:underline; }
.header__top .header__kontakt ul { float:right; }
.header__top .header__kontakt li { float:right;margin-left:15px; }
.header__top .header__akcije ul,.header__top .header__akcije li { float:left; color:#fff; }
@media only screen and (max-width: 479px) {
    .header__cart { float:right; background-image: url(/game_computer_store/img/cart.svg); background-position: center; background-repeat: no-repeat; background-size: 55% 55%; float: right; }
    .header__cart span { position: absolute; top: 2px!important; left: 20px!important; }
    .header__user,.header__cart,.header__tel { margin-top:-5px!important; }
}
@media only screen and (max-width: 767px) {
    .header__sub, .header__top { display: none; }
}
@media only screen and (max-width: 1024px) {
    .header__user,.header__cart,.header__tel { float:left;display:none;margin-top:.125rem;margin-right:.625rem;margin-left:0; }
    .header__cart { display: block; margin: 0px 0px 0px 5px; }
    .header__tel { display: block; margin: 0px 0px 0px 0px; }
    .header__sub, .header__top { display: none; }
}
@media only screen and (max-width: 1199px) {
    .header__sub,.header__top { padding-top:.9375rem;padding-bottom:.9375rem; }
    .header__list { float:none;text-align:center;margin:0; }
}
@media only screen and (max-width: 1299px) {
    .header__user,.header__cart,.header__tel{width:38px;height:35px;border-radius:50%;text-indent:-999px;color:transparent;padding:0;font-size:0;margin-top:0;margin-left:-10px;background-image:url(/game_computer_store/img/user.svg);background-position:center;background-repeat:no-repeat;background-size:55% 55%; }
    .header__user:before, .header__cart:before, .header__tel:before { display: none!important; }
    .header__cart { background-image: url(/game_computer_store/img/cart.svg); background-position: center; background-repeat: no-repeat; background-size: 55% 55%; }
    .header__cart span { position: absolute; top: 0px; }
}
.header__list { float:left; margin:5px 15px 15px 0px; }
.header__list li { line-height:1.2;display:inline-block;position:relative;font-size: 13px;color:#111;padding:0 30px 0 5px; }
.header__list li.hardware { background-image:url(/game_computer_store/img/svg/hardware.svg);background-position:left;background-repeat:no-repeat; }
.header__list li.config { background-image:url(/game_computer_store/img/svg/konfiguracija.svg);background-position:left;background-repeat:no-repeat; }
.header__list li.garancija { background-image:url(/game_computer_store/img/svg/garancija.svg);background-position:left;background-repeat:no-repeat; }
.header__list li.dostava { background-image:url(/game_computer_store/img/svg/dostava-bih.svg);background-position:left;background-repeat:no-repeat; }
.header__list li:first-child { padding-left: 20px !important; margin-left: 0px; }

.header__list li.config:before, .header__list li.hardware:before, .header__list li.garancija:before, .header__list li.dostava:before { content: '';
    display: block;
    width: 1rem;
    height: 1rem;
    position: absolute;
    top: 0px;
    left: 0;
    /*background-image: url(/game_computer_store/img/list-blue.png);*/
    /*background-position: center;*/
    /*background-repeat: no-repeat;*/
    /*background-size: 100%;*/
 }
 
.header__list .checkbox-usp { 
    padding-top: 0px;
    width: 14px;
    height: 18px;
    margin-left: -18px;
    margin-top: -2px;
    position: absolute;  }
.header__info { float:right;margin:0; }
.header__info li { height:43px;line-height:34px;display:block;padding-right:.6875rem;padding-left:.6875rem;position:relative;font-size:12px;color:#111;float:left; }
.header__info li:before { width:1px;content:'';height:20px;background:rgba(255,255,255,0.1);position:absolute;top:.625rem;left:0; }
.header__info li:first-child { padding-left:0; }
.header__info li:first-child:before { display:none; }
.header__info li:last-child { padding-right:0; }
.header__info li img { display:inline-block; width:150px; margin-top: 0px; }
.header__toggle { float:left;display:none;line-height:1;color:#fff;text-transform:uppercase;font-size:1rem;position:relative;margin-top:25px; margin-left:10px;padding-left:25px; }
.header__toggle span:after { content:'';width:100%;height:3px;display:block;background:#fff;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;top:50%;left:0; }
.header__toggle:hover { color:#fff; }
.header__toggle span { width:20px;display:block;overflow:hidden;text-indent:-999px;border-top:3px solid #fff;border-bottom:3px solid #fff;font-size:0;padding-top:5px;padding-bottom:5px;position:absolute;top:-1px;left:0; }
.header--fixed .header__sub,.header--fixed .header__top { opacity:0;max-height:0;overflow:hidden;visibility:hidden;padding:0; }

@media only screen and (max-width: 479px) {
.header__toggle { margin-top: 6px!important; }
}

@media only screen and (max-width: 1299px) {
.header__toggle { float:right;display:block;line-height:1;color:#fff;text-transform:uppercase;font-size:1rem;position:relative;margin-top:16px; padding-left:25px; }
.header__toggle span:after { content:'';width:100%;height:3px;display:block;background:#fff;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;top:50%;left:0; }
.header__toggle:hover { color:#fff; }
.header__toggle span { width:20px;display:block;overflow:hidden;text-indent:-999px;border-top:3px solid #fff;border-bottom:3px solid #fff;font-size:0;padding-top:5px;padding-bottom:5px;position:absolute;top:-1px;left:0; }
}

.menu-non-mobile { font-size: 14px; float:left; position:relative; margin-top:7.5px; padding-left:3px; margin-left:12px; }
.menu-non-mobile li a, .menu-non-mobile li { border: none!important; }


.header .cartBox { float:right;margin:10px 0px 0 0; }
.header .accountBox { float:right;margin-top:10px; }
@media only screen and (max-width: 479px) {
    .header .cartBox { margin: 0px; }
}
@media only screen and (max-width: 767px) {
    .header__sub, .header__top { display: none; }
    .header__toggle span { position: absolute; top: -0.125rem; left: 0; }
}
@media only screen and (max-width: 1024px) {
    .header__sub,.header__top { display:none; }
    .header .cartBox { float:left;margin:0; }
    .header__cart,.header__tel, .header__toggle {display:block;}
}
@media only screen and (max-width: 1199px) {
    .header__sub,.header__top { padding-top:.9375rem;padding-bottom:.9375rem; }
    .header__list { float:none;text-align:center;margin:0; }
    .header__info { display:none; }
}
@media only screen and (max-width: 1299px) {
    .header__cart span { position:absolute;top:0;left:1.4375rem; }
    .menu-non-mobile {display:none;}

}
.nav > li > a { position: relative; display: block; padding: 13px 10px; color:#fff; border: 1px solid #ddd; } 
.nav>li>a:hover,.nav>li>a:focus, .nav > li > a:hover, .nav > li > a:focus { text-decoration:none; background:none!important; color:#f60; }
li#search-tab a { color: #111; }

.cart .sticky-bestellen-btn { width:100%;font-size:14px; }
.cartBox a.cart { display:block;line-height:34px;color:#282828;font-size: 14px;text-decoration:none;padding:0 15px 0 45px; }
.cartBox a.cart span.count { display:inline-block;width:20px;height:20px;text-align:center;line-height:20px;background:#28d58a;font-size: 14px;color:#fff;margin-right:5px;border-radius: 50%; }
.cartBox .dropdown-menu { width:292px;position:absolute;top:32px;left:-142px;display:none; }
@media only screen and (max-width: 1024px) {
    .cartBox .dropdown-menu { left: 0px; }
}
.cartBox .dropdown-menu .cart { padding:6px; }
.cartBox .border-block h3 { font-size:18px;margin-bottom:-10px; }
.cartBox .border-block a.header__cart { float:right; }
.cartBox .border-block a { font-weight:400;font-size:12px; }
.cartBox .border-block p { font-size: 14px;color:#111;margin:10px 10px 10px 0; }
.cartBox .border-block { border-bottom:1px solid #ddd;margin-left:6px;margin-right:6px;padding:0; }
.cartBox .dropdown-menu .total { min-height:82px;padding:10px 15px; }
.cartBox .dropdown-menu .cart strong { color:#282828;font-size: 14px;display:block; }
.cartBox .dropdown-menu .cart strong a { font-weight:700;color:#282828; }
.cartBox .dropdown-menu .cart ul { list-style:none;margin:0 5px;padding:0; }
.cartBox .dropdown-menu .cart li { overflow:hidden;border-bottom:1px solid #ddd;color:#111;padding:10px 10px 10px 0; }
.cartBox .dropdown-menu .image { float: left; width: 73px; height: 73px; margin-right: 15px; }
.cartBox .dropdown-menu .image img { max-width: 100%;  max-height: 100%; }
.cartBox .dropdown-menu .details { float: left; width: 140px; }
.cartBox .dropdown-menu .details h3 { font-size: 14px; padding: 0; margin: 0; font-weight: 900; color: #111; float: left!important; text-align: left; }
.cartBox .dropdown-menu .details span { font-size: 12px; float: left; text-transform: uppercase; }
.cartBox .dropdown-menu a.delete { margin: -6px 0px 0px 7px; font-size: 14px; float: right; }
.cartBox .dropdown-menu .total .amount {nfloat: left; width: 100%; margin-top: -8px; }
.cartBox .dropdown-menu .total .order { float: right; width: 100%; margin-top: 8px; }
.cartBox .dropdown-menu .total .order .btn { padding: 17px; width: 100%; border-radius: 25px; }
.cartBox .dropdown-menu .total strong { display: block; font-size: 16px; float: left; }
.cartBox .dropdown-menu .total span { display: block; font-size: 19px; color: #111; font-size: 16px; font-weight: 700; margin-top: -31px; float: right; clear: both; text-transform: uppercase; }
.cartBox .dropdown-menu .total em { color: #7c7c7c; font-size: 14px; display: block; margin-top: 5px }
.cartBox .dropdown-menu .total em a { font-style: normal; color: #282828; }
.cartBox:hover .dropdown-menu { display: block; border: none; box-shadow: none; border: 1px solid #ddd; background: #fff; border-radius: 3px; -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%); box-shadow: 0 6px 12px rgb(0 0 0 / 18%); margin-top: 4px; }
.cartBox .freeshipping { font-size: 14px;text-align:left;color:#111; }
.cartBox .freeshipping span { color:#fff;font-size: 12px; }
.cartBox .wijzigen { font-size: 14px;text-align:right;float:right;margin-top:10px; }
.cartBox .button { transition: background .1s linear; display: block; background: #28d58a; border-radius: 2px; line-height: 38px; color: #fff; font-size: 14px; font-weight: bold; text-align: center; text-decoration: none; }
.cartBox .button:hover { background: #333333; }

.usps-mobile {
    display: block;
    padding: 0px 20px 20px 20px;
    background: #fff;
    margin-top: -15px;
}

.usps-mobile .usp-item {
  display: flex;
  align-items: center;
  text-align: left;
  margin-bottom: 0px;
}

.usps-mobile .icon-with-text__icon {
  margin-right: 5px;
  flex-shrink: 0;
}

.usps-mobile .icon {
    width: 14px;
    height: 14px;
    fill: #28a745;
    margin-top: -4px;
}

.usps-mobile .icon-with-text__text {
  font-size: 14px;
  color: #333;
}

.usps-mobile .highlight {
  color: #f60;
  font-weight: bold;
}

/* Hide on tablet/desktop */
@media (min-width: 768px) {
  .usps-mobile {
    display: none;
  }
}

.usps-desktop {
    padding: 10px 20px 10px 0px;
    background: #fff;
    margin-top: 0px; /* Ovaj negativni margin može uzrokovati preklapanje s elementom iznad, provjerite je li to željeni efekat */
}

.usps-desktop .usp-item {
    display: flex;
    align-items: center; /* Ovo pomaže da se kvačica i tekst vertikalno poravnaju */
    text-align: left;
    /* Ako želite razmak između stavki, dodajte margin-bottom: */
    margin-bottom: 5px; /* Npr. 10px, prilagodite po potrebi. Ako je ovo zadnja stavka, možda ne želite marginu */
}
/* Uklonite marginu sa zadnje stavke ako je potrebno */
.usps-desktop .usp-item:last-child {
    margin-bottom: 0;
}


/* Stil za kvačicu koristeći ::before pseudo-element na spanu koji drži tekst i (sada virtuelnu) ikonu */
.usps-desktop .icon-with-text::before {
    content: "✓";              /* Unicode znak za kvačicu (checkmark) */
    color: #28a745;            /* Zelena boja, ista kao za vašu prethodnu .icon klasu */
    margin-right: 8px;         /* Razmak između kvačice i teksta. Prilagodite po potrebi. */
    font-weight: bold;         /* Da kvačica bude malo jača/deblja */
    font-size: 1.1em;          /* Malo veća kvačica od teksta, prilagodite po želji */
                               /* Možda ćete trebati fino podesiti vertikalno poravnanje s 'position: relative; top: -1px;' */
                               /* ali 'align-items: center;' na roditeljskom '.usp-item' bi trebalo dobro da radi. */
}

.usps-desktop .icon-with-text__text {
    font-size: 14px;
    color: #333;
    /* line-height: 1.2; */ /* Možete probati s line-height ako poravnanje nije savršeno */
}

.usps-desktop .highlight {
    color: #f60;
    font-weight: bold; /* Ovo je već tu, ali osigurava da ostane boldirano */
}

.search-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 59px;
  z-index: 10;
}

.search-modal {
  background: #fff;
  border-radius: 5px;
  max-width: 1280px;
  width: 90%;
  padding: 20px;
  max-height: 80vh;
  overflow-y: auto;
  position: relative;
  box-shadow: 0 20px 50px rgba(0,0,0,0.2);
}

.search-modal-close {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 24px;
  background: none;
  border: none;
  cursor: pointer;
}

.hidden {
  display: none;
}

body.no-scroll {
    overflow: hidden;
}

.header .btn-toolbar .search input { padding: 0px 13px; height: 47px; font-size: 14px; color: #7e7e7e; float: left; border: none; line-height: 44px; border: 1px solid #ddd; box-shadow: none; border-radius: 0; }
.header .btn-toolbar .badge.badge-success { margin: 0 0 0 5px; display: inline-block; width: 26px; height: 26px; line-height: 20px; text-align: center; font-size: 14px; color: #fff; border-radius: 100%; background: #29cb85; font-weight: normal; }
.header .btn-toolbar .search .btn { width: 47px; height: 47px; text-align: center; border: 1px solid #ddd; padding: 0; background: #f8f8f8; border-radius: 0; font-size: 22px; }
.main-menu { background: #ddd; width: 100%; }
.main-menu ul { list-style: none; margin: 0px; position: relative; width: 100%; }
.main-menu ul li { float: left; }
.main-menu ul>li>a, .main-menu ul>li .dropdown-item>a { padding: 19px 20px 18px; display: block; font-size: 14px; color: #fff; text-decoration: none; text-transform: uppercase; border-bottom: 2px solid transparent; background-color: #ddd; }
.main-menu ul>li .dropdown-item>a { padding: 18px 20px 18px; }
@media only screen and (max-width: 1024px) {
    .main-menu ul>li>a, .main-menu ul>li .dropdown-item>a { padding: 20px 6px; font-size: 14px; }
    .cartBox .dropdown-menu .total .order .btn { padding: 12px; }
}

        /* --- Main mobile menu container --- */
        .mobile {
            width: 250px;
            height: 100vh;
            overflow-y: auto;
            color: #111;
            background: #fff;
            position: fixed;
            top: 0;
            right: 0; /* The menu is visible by default in this example */
            padding-top: 4.375rem;
            padding-bottom: 2rem;
            border-left: 1px solid #ddd;
            box-sizing: border-box;
            /* In your site, this is controlled by the 'menu-open' class on the body */
        }
        
        .mobile-submenu { margin-top: 20px; }
        
        .mobile .ljetni-popusti, .mobile .kombo-ponude { margin-left: 10px; margin-bottom: 0px; }

        .mobile ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        /* --- Mobile Menu Header --- */
        .mobile .mobile__header {
            z-index: 10;
            width: 250px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            background: #fff;
            padding: 0.9375rem;
            position: absolute;
            top: 0;
            right: 0;
            border-bottom: 1px solid #ddd;
            box-sizing: border-box;
        }

        .mobile .mobile__header > a {
            color: #111;
            text-transform: uppercase;
            font-size: 1rem;
            position: relative;
            padding-left: 1.75rem;
            text-decoration: none;
        }

        .mobile .mobile__header > a span {
            display: block;
            overflow: hidden;
            width: 1.25rem;
            height: 1.25rem;
            text-indent: -999px;
            font-size: 0;
            position: absolute;
            top: .1875rem;
            left: 0;
        }

        .mobile .mobile__header > a span:before,
        .mobile .mobile__header > a span:after {
            content: '';
            width: 100%;
            height: 1px;
            display: block;
            background: #333;
            position: absolute;
            left: 0;
        }

        .mobile .mobile__header > a span:before { top: 0.5625rem; transform: rotate(45deg); }
        .mobile .mobile__header > a span:after { bottom: 0.5625rem; transform: rotate(-45deg); }

        /* --- Menu Item Styling (All Levels) --- */
        .mobile ul li {
            position: relative;
            border-bottom: 1px solid #e9e9e9;
        }
        .mobile > ul > li:last-child {
            border-bottom: none;
        }

        .mobile li a {
            display: block;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            color: #111;
            text-decoration: none;
            transition: color 0.2s, background-color 0.2s;
        }

        /* Level 1 Item Links */
        .mobile > ul > li > a {
            padding: 10px 10px 10px 10px;
            font-size: 14px;
            font-weight: 500;
            text-transform: uppercase;
        }
        
        /* Arrow styling for any item that has a submenu */
        .mobile li.has-sub > a {
            padding-right: 2.5rem; /* Make space for the arrow */
        }
        
        /* --- ARROW FIX --- */
        /* Using a fixed 'top' value instead of 'top: 50%' to prevent vertical shift when the LI expands. */
        .mobile li.has-sub > a::after {
            content: '';
            display: block;
            width: 0.5rem;
            height: 0.5rem;
            position: absolute;
            top: 18px;
            right: 1rem;
            border-style: solid;
            border-color: #888;
            border-width: 0 2px 2px 0;
            transform: rotate(45deg); /* Point down */
            transition: transform 0.2s ease, border-color 0.2s ease;
        }

        /* Active state for link and arrow */
        .mobile li.is-active > a {
            color: #0090e2;
            background-color: #f8f8f8;
        }
        
        /* Removed 'margin-top' from the active state, as the fixed 'top' position handles alignment. */
        .mobile li.is-active > a::after {
            border-color: #0090e2;
            transform: rotate(-135deg); /* Point up */
        }
        /* --- END OF ARROW FIX --- */

        /* --- Sub-menu Styling --- */
        .mobile ul ul {
            display: none; /* Sub-menus are hidden by default, JS will show them */
            background-color: #f8f8f8;
            position: static;
            width: 100%;
            float: none;
            box-shadow: none;
            border: none;
            margin: 0;
            padding: 0;
        }

        /* Level 2 Item Links */
        .mobile ul ul li a {
            padding: 0.7rem 1rem 0.7rem 2rem; /* Increased indentation */
            font-size: 14px;
            font-weight: 400;
            text-transform: none;
            color: #333;
            border-top: 1px solid #e5e5e5;
        }
        
        /* Level 3 Item Links */
        .mobile ul ul ul li a {
            padding-left: 3rem; /* Further indentation */
            background-color: #f0f0f0;
        }

        /* Level 4 Item Links */
        .mobile ul ul ul ul li a {
            padding-left: 4rem; /* Even more indentation */
            background-color: #e8e8e8;
        }
        
.mobile__user { padding-right: 0; }
.mobile__user:before { background-image: url(/game_computer_store/img/user-blue.svg); background-position: center; background-repeat: no-repeat; background-size: 15px; }

@media only screen and (max-width: 571px) {
    .mobilebannerBox h2 { font-size:23px;line-height:33px; }
    .mobilebannerBox .button { width:100%;margin:0 0 10px; }
    .mobilebannerBox .holder { margin-right:0; }
}

@media (min-width: 992px) { /* Apply these styles only on desktop */
    .mobile { display: none; }
}

.usp-mobile { background-color:#fafafa;margin-top:0;padding:12px; }
.usp-mobile ul { list-style:none;overflow:hidden;margin:0;padding:0; }
.usp-mobile li { position:relative;float:left;font-family: "DM Sans", sans-serif;font-size: 14px;color:#333;padding:0 10px 0 15px; }
.usp-mobile li:before { position:absolute;left:0;font-family:FontAwesome;content:"\f058";font-size: 14px;color:#19a4ff; }
.usp-mobile li a { color:#333;text-decoration:none; }
.usp-mobile li a:hover { text-decoration:underline; }


/* --- Slide-Out Cart Panel --- */
body.cart-panel-is-open {
    overflow: hidden; /* Prevent background scroll when panel is open */
}

.cart-slide-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Darker overlay */
    z-index: 10040; /* Below panel, above most content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0s linear 0.3s; /* Delay visibility transition */
}

.cart-slide-overlay.is-active {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

.cart-slide-panel {
    position: fixed;
    top: 0;
    right: -100%; /* Start fully off-screen */
    width: 90vw; /* Responsive width */
    max-width: 400px; /* Max width as requested */
    height: 100%; /* Full viewport height */
    background-color: #ffffff;
    box-shadow: -3px 0 15px rgba(0,0,0,0.2);
    z-index: 10050; /* Above overlay */
    transition: right 0.35s cubic-bezier(0.25, 0.1, 0.25, 1); /* Smooth slide */
    display: flex;
    flex-direction: column;
}

.cart-slide-panel.is-open {
    right: 0; /* Slide in */
}

.cart-slide-panel__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 15px;
    border-bottom: 1px solid #e9ecef;
    background-color: #fff; /* Optional light header background */
    flex-shrink: 0; /* Header should not shrink */
}

.cart-slide-panel__header h3 {
    margin: 0;
    font-size: 26px;
    font-weight: 500;
    color: #285dab;
    text-transform: uppercase;
}

.cart-slide-panel__close-btn {
    background: none;
    border: none;
    font-size: 2rem;
    font-weight: 300;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    color: #6c757d; /* Greyish color */
    opacity: 0.7;
}

.cart-slide-panel__close-btn:hover {
    color: #000;
    opacity: 1;
    text-decoration: none;
}

.cart-slide-panel__body {
    flex-grow: 1; /* Allows this section to take up remaining space */
    overflow-y: auto; /* Enable scrolling for cart items */
    padding: 0; /* Content inside will have its own padding */
}

.cart-panel-empty {
    text-align: center;
    padding: 50px 20px;
    color: #6c757d;
}

.cart-panel-empty .cart-empty-notice {
    font-size: 1rem; /* 16px */
    margin-bottom: 20px;
}

ul.cart-panel-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

li.cart-panel-item {
    display: flex;
    align-items: flex-start; /* Align items to the top for multi-line text */
    padding: 15px;
    border-bottom: 1px solid #e9ecef!important;
    position: relative;
}

li.cart-panel-item:last-child {
    border-bottom: none;
}

.cart-panel-item__image {
    width: 60px; /* Fixed width for image container */
    height: 60px;
    margin-right: 15px;
    flex-shrink: 0; /* Prevent image container from shrinking */
    /*border: 1px solid #eee;*/
    border-radius: 3px;
}

.cart-panel-item__image img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ensure whole image is visible */
}

.cart-panel-item__details {
    flex-grow: 1; /* Allow details to take remaining space */
    padding-right: 25px; /* Space for remove button if positioned absolutely */
}

.cart-panel-item__details .cart-panel-item__title {
    font-size: 0.875rem; /* 14px */
    font-weight: 900;
    margin: 0 0 4px 0;
    line-height: 1.3;
    color: #111;
}

.cart-panel-item__details .cart-panel-item__title a {
    color: inherit;
    text-decoration: none;
}

.cart-panel-item__details .cart-panel-item__title a:hover {
    color: #007bff; /* Your theme's link hover color */
    text-decoration: underline;
}

.cart-panel-item__details .cart-panel-item__price {
    font-size: 14px;
    color: #495057;
    text-transform: uppercase;
}
span.cart-panel-item__old-price { 
    font-size: 14px;
    color: #a2a2a2;
    text-transform: uppercase;
}

span.cart-panel-item__old-price .oblique-striketrough { position: relative; font-weight: 400; text-decoration: line-through; color: #666; opacity: 0.5; }

.cart-panel-item__remove {
    position: absolute; /* Position remove button to the far right */
    top: 15px;
    right: 15px;
}

.cart-panel-item__remove .remove-item-btn {
    color: #dc3545; /* Red color for remove */
    text-decoration: none;
    font-size: 1.25rem; /* Larger 'x' or icon */
    font-weight: bold;
    background: none;
    border: none;
    padding: 0;
    line-height: 1;
    opacity: 0.7;
}

.cart-panel-item__remove .remove-item-btn:hover {
    color: #c82333;
    opacity: 1;
}

.cart-panel-summary {
    padding: 12px 15px;
    background-color: #fff;
    font-size: 14px; 
    text-align: center;
    /*border-top: 1px solid #ddd;*/
    flex-shrink: 0; /* Summary should not shrink */
}

.cart-panel-summary .freeshipping {
    color: #111; /* Green for free shipping */
    font-weight: bold;
    font-size: 14px;
}

.cart-panel-summary .freeshipping span {
    color: #00b200;
    font-weight: bold;
    font-size: 14px;
    float: right;
}


.cart-panel-footer {
    padding: 15px;
    border-top: 1px solid #ddd;
    background-color: #fff;
    /*box-shadow: 0 -2px 5px rgba(0,0,0,0.05);*/
    flex-shrink: 0; /* Footer should not shrink */
}

.cart-panel-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1rem; /* 16px */
    margin-bottom: 15px;
    color: #111;
}

.cart-panel-total strong {
    font-weight: normal;
    font-size: 14px;
}

.cart-panel-total .price {
    font-weight: 900;
    font-size: 17px;
    text-transform: uppercase;
}

.cart-panel-actions .btn {
    width: 100%;
    padding: 10px 15px;
    font-size: 0.9375rem; /* 15px */
    font-weight: 900;
    /* text-transform: uppercase; /* Optional */
    border-radius: 4px;
}

.cart-panel-actions .view-cart-btn {
    margin-top: 8px;
    background-color: #fff; /* Bootstrap secondary grey */
    border-color: #ddd;
    color: #111;
    font-weight: 500;
}

.cart-panel-actions .view-cart-btn:hover {
    background-color: #fff;
    border-color: #b9b9b9;
    color: #111;
}

/* Your header__cart icon and badge styles */
.header__cart {
    position: relative; /* For badge positioning */
    /* Ensure it's clickable, add padding if needed for tap area */
}

.header__cart span.cart-quantity-badge {
    position: absolute;
    top: 0px!important;
    left: 14px!important;
    background-color: #f60;
    color: white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 10px;
    line-height: 17px;
    text-align: center;
    font-weight: bold;
}


/* --- Mobile Slider Specific Styles (max-width: 767px) --- */
@media (max-width: 767px) {
.header__cart span.cart-quantity-badge { top: 8px !important; left: 25px !important; }

}

.cart-panel-items .akcija-cart {
    position: relative;
    margin-right: 30px;
    margin-top: 2px;
}

.cart-panel-items .label {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 14px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60;
    display: inline-block;
    padding: .2rem .4rem .4rem;
}


/* --- Slide-Out Cart Panel --- */
body.cart-panel-is-open {
    overflow: hidden; /* Prevent background scroll when panel is open */
}

.cart-slide-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Darker overlay */
    z-index: 10040; /* Below panel, above most content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0s linear 0.3s; /* Delay visibility transition */
}

.cart-slide-overlay.is-active {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

.cart-slide-panel {
    position: fixed;
    top: 0;
    right: -100%; /* Start fully off-screen */
    width: 90vw; /* Responsive width */
    max-width: 400px; /* Max width as requested */
    height: 100%; /* Full viewport height */
    background-color: #ffffff;
    box-shadow: -3px 0 15px rgba(0,0,0,0.2);
    z-index: 10050; /* Above overlay */
    transition: right 0.35s cubic-bezier(0.25, 0.1, 0.25, 1); /* Smooth slide */
    display: flex;
    flex-direction: column;
}

.cart-slide-panel.is-open {
    right: 0; /* Slide in */
}

.cart-slide-panel__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 15px;
    border-bottom: 1px solid #e9ecef;
    background-color: #fff; /* Optional light header background */
    flex-shrink: 0; /* Header should not shrink */
}

.cart-slide-panel__header h3 {
    margin: 0;
    font-size: 23px;
    font-weight: 900;
    color: #285dab;
    text-transform: uppercase;
    margin-top: -10px;
}

.cart-slide-panel__header h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    float: left;
    position: absolute;
    margin-top: 28px;
}


.cart-slide-panel__close-btn {
    background: none;
    border: none;
    font-size: 2rem; /* Larger 'x' */
    font-weight: 300;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    color: #6c757d; /* Greyish color */
    opacity: 0.7;
}

.cart-slide-panel__close-btn:hover {
    color: #000;
    opacity: 1;
}

.cart-slide-panel__body {
    flex-grow: 1; /* Allows this section to take up remaining space */
    overflow-y: auto; /* Enable scrolling for cart items */
    padding: 0; /* Content inside will have its own padding */
}

.cart-panel-empty {
    text-align: center;
    padding: 50px 20px;
    color: #6c757d;
}

.cart-panel-empty .cart-empty-notice {
    font-size: 1rem; /* 16px */
    margin-bottom: 20px;
}

ul.cart-panel-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

li.cart-panel-item {
    display: flex;
    align-items: flex-start; /* Align items to the top for multi-line text */
    padding: 15px;
    border-bottom: 1px solid #e9ecef!important;
    position: relative;
}

li.cart-panel-item:last-child {
    border-bottom: none;
}

.cart-panel-item__image {
    width: 60px; /* Fixed width for image container */
    height: 60px;
    margin-right: 15px;
    flex-shrink: 0; /* Prevent image container from shrinking */
    /*border: 1px solid #eee;*/
    border-radius: 3px;
}

.cart-panel-item__image img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ensure whole image is visible */
}

.cart-panel-item__details {
    flex-grow: 1; /* Allow details to take remaining space */
    padding-right: 25px; /* Space for remove button if positioned absolutely */
}

.css-h350ag {
    color: #f60!important;
}

.cart-panel-item__details .cart-panel-item__title {
    font-size: 14px; /* 14px */
    font-weight: 500;
    margin: 9px 0 4px 0;
    line-height: 1.3;
    color: #0090e2;
}

.cart-panel-item__details .cart-panel-item__title a {
    color: inherit;
    text-decoration: none;
}

.cart-panel-item__details .cart-panel-item__title a:hover {
    color: #007bff; /* Your theme's link hover color */
    text-decoration: underline;
}

.cart-panel-item__details .cart-panel-item__price {
    font-size: 14px; 
    color: #111;
    font-weight: 900;
}

.cart-panel-item__remove {
    position: absolute; /* Position remove button to the far right */
    top: 11px;
    right: 15px;
}

.cart-panel-item__remove .remove-item-btn {
    color: #ddd; /* Red color for remove */
    text-decoration: none;
    font-size: 1.25rem; /* Larger 'x' or icon */
    font-weight: bold;
    background: none;
    border: none;
    padding: 0;
    line-height: 1;
    opacity: 0.7;
}

.cart-panel-item__remove .remove-item-btn:hover {
    color: #111;
    opacity: 1;
}

.top-remove { margin-top: 7px; }

.cart-panel-summary {
    padding: 12px 15px;
    background-color: #fff;
    font-size: 14px; 
    text-align: left;
    /*border-top: 1px solid #e9ecef;*/
    flex-shrink: 0; /* Summary should not shrink */
}

.cart-panel-summary .freeshipping {
    color: #111; /* Green for free shipping */
    font-weight: bold;
}

.cart-panel-summary .freeshipping span {
    color: #00b200; /* Green for free shipping */
    font-weight: bold;
    font-size: 14px;
    float: right;
}

.cart-panel-footer {
    padding: 15px;
    border-top: 1px solid #e9ecef;
    background-color: #fff;
    /*box-shadow: 0 -2px 5px rgba(0,0,0,0.05);*/
    flex-shrink: 0; /* Footer should not shrink */
}

.cart-panel-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1rem; /* 16px */
    margin-bottom: 15px;
    color: #111;
}

.cart-panel-total strong {
    font-weight: 900;
}

.cart-panel-total .price {
    font-weight: 700;
    font-size: 1.125rem; /* 18px */
}

.cart-panel-actions .btn {
    width: 100%;
    padding: 15px 15px;
    font-size: 0.9375rem; /* 15px */
    font-weight: 900;
    /* text-transform: uppercase; /* Optional */
    border-radius: 4px;
    box-shadow: inset 0 -2px 0 0 #090;
    min-height: 45px;
    font-size: 14px;
}

.cart-panel-actions .view-cart-btn {
    margin-top: 8px;
    background-color: #fff;
    border-color: #ddd;
    color: #111;
    box-shadow: none;
    font-weight: 500;
}

.cart-panel-actions .view-cart-btn:hover {
    background-color: #fff;
    border-color: #b9b9b9;
    color: #111;
    box-shadow: none;
}

/* Your header__cart icon and badge styles */
.header__cart {
    position: relative; /* For badge positioning */
    /* Ensure it's clickable, add padding if needed for tap area */
}

.compare-slide-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Darker overlay */
    z-index: 10040; /* Below panel, above most content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0s linear 0.3s; /* Delay visibility transition */
}

.compare-slide-overlay.is-active {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

.compare-slide-panel {
    position: fixed;
    top: 0;
    right: -100%; /* Start fully off-screen */
    width: 90vw; /* Responsive width */
    max-width: 400px; /* Max width as requested */
    height: 100%; /* Full viewport height */
    background-color: #ffffff;
    box-shadow: -3px 0 15px rgba(0,0,0,0.2);
    z-index: 10050; /* Above overlay */
    transition: right 0.35s cubic-bezier(0.25, 0.1, 0.25, 1); /* Smooth slide */
    display: flex;
    flex-direction: column;
}

.compare-slide-panel.is-open {
    right: 0; /* Slide in */
}

.compare-slide-panel__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 15px;
    border-bottom: 1px solid #e9ecef;
    background-color: #fff; /* Optional light header background */
    flex-shrink: 0; /* Header should not shrink */
}

.compare-slide-panel__header h3 {
    margin: 0;
    font-size: 23px;
    font-weight: 900;
    color: #285dab;
    text-transform: uppercase;
    margin-top: -10px;
}

.compare-slide-panel__header h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    float: left;
    position: absolute;
    margin-top: 28px;
}

.compare-slide-panel__close-btn {
    background: none;
    border: none;
    font-size: 2rem; /* Larger 'x' */
    font-weight: 300;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    color: #6c757d; /* Greyish color */
    opacity: 0.7;
}

.compare-slide-panel__close-btn:hover {
    color: #000;
    opacity: 1;
}

.compare-slide-panel__body {
    flex-grow: 1; /* Allows this section to take up remaining space */
    overflow-y: auto; /* Enable scrolling for compare items */
    padding: 0; /* Content inside will have its own padding */
}

.compare-panel-empty {
    text-align: center;
    padding: 50px 20px;
    color: #6c757d;
}

.compare-panel-empty .compare-empty-notice {
    font-size: 1rem; /* 16px */
    margin-bottom: 20px;
}

ul.compare-panel-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

li.compare-panel-item {
    display: flex;
    align-items: flex-start; /* Align items to the top for multi-line text */
    padding: 15px;
    border-bottom: 1px solid #e9ecef !important;
    position: relative;
}

li.compare-panel-item:last-child {
    border-bottom: none;
}

.compare-panel-item__image {
    width: 60px; /* Fixed width for image container */
    height: 60px;
    margin-right: 15px;
    flex-shrink: 0; /* Prevent image container from shrinking */
    border-radius: 3px;
}

.compare-panel-item__image img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ensure whole image is visible */
}

.compare-panel-item__details {
    flex-grow: 1; /* Allow details to take remaining space */
    padding-right: 25px; /* Space for remove button if positioned absolutely */
}

.compare-panel-item__details .compare-panel-item__title {
    font-size: 14px; /* 14px */
    font-weight: 500;
    margin: 9px 0 4px 0;
    line-height: 1.3;
    color: #0090e2;
}

.compare-panel-item__details .compare-panel-item__title a {
    color: inherit;
    text-decoration: none;
}

.compare-panel-item__details .compare-panel-item__title a:hover {
    color: #007bff; /* Your theme's link hover color */
    text-decoration: underline;
}

.compare-panel-item__details .compare-panel-item__price {
    font-size: 14px;
    color: #111;
    font-weight: 900;
}

span.compare-panel-item__old-price {
    font-size: 14px;
    color: #a2a2a2;
    text-transform: uppercase;
}

span.compare-panel-item__old-price .oblique-striketrough {
    position: relative;
    font-weight: 400;
    text-decoration: line-through;
    color: #666;
    opacity: 0.5;
}


.compare-panel-item__remove {
    position: absolute; /* Position remove button to the far right */
    top: 11px;
    right: 15px;
}

.compare-panel-item__remove .remove-compare-item-btn {
    color: #ddd; /* Red color for remove */
    text-decoration: none;
    font-size: 1.25rem; /* Larger 'x' or icon */
    font-weight: bold;
    background: none;
    border: none;
    padding: 0;
    line-height: 1;
    opacity: 0.7;
}

.compare-panel-item__remove .remove-compare-item-btn:hover {
    color: #111;
    opacity: 1;
}

.compare-slide-panel__footer {
    padding: 15px;
    border-top: 1px solid #e9ecef;
    background-color: #fff;
    flex-shrink: 0; /* Footer should not shrink */
}

.compare-panel-actions .btn {
    width: 100%;
    padding: 15px 15px;
    font-size: 0.9375rem; /* 15px */
    font-weight: 900;
    border-radius: 4px;
    box-shadow: inset 0 -2px 0 0 #090;
    min-height: 45px;
    font-size: 14px;
}

.compare-panel-actions .clear-compare-btn {
    margin-top: 8px;
    background-color: #fff;
    border-color: #ddd;
    color: #111;
    box-shadow: none;
    font-weight: 500;
}

.compare-panel-actions .clear-compare-btn:hover {
    background-color: #fff;
    border-color: #b9b9b9;
    color: #111;
    box-shadow: none;
}

/* Styles for the header compare icon and badge */
.header__compare {
    position: relative;
}

.header__compare .badge-head {
    position: absolute;
    top: 0px !important; /* Adjust as needed */
    left: 14px !important; /* Adjust as needed */
    background-color: #f60;
    color: white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 10px;
    line-height: 17px;
    text-align: center;
    font-weight: bold;
}

/* Mobile specific adjustments for compare badge */
@media (max-width: 767px) {
    .header__compare .badge-head {
        top: 8px !important; /* Adjust for mobile header */
        left: 25px !important; /* Adjust for mobile header */
    }
}

.compare-panel-items .akcija-compare {
    position: relative;
    margin-right: 30px;
    margin-top: 2px;
}

.compare-panel-items .label {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 14px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60;
    display: inline-block;
    padding: .2rem .4rem .4rem;
}

/* --- Hero Benefits Bar Styling --- */
.hero-benefits-bar {
    padding: 12px 0;
    background-color: #f8f9fa;
    max-height: 60px;
    margin-bottom: 10px;
    margin-top: 0px;
}

.hero-benefits-bar .hero-benefits-slider { /* Swiper container */
    position: relative;
}

/* === DESKTOP STYLES === */
@media (min-width: 768px) { /* Apply these styles only on desktop */

    .hero-benefits-bar .hero-benefits-list { /* This is the UL */
        list-style: none;
        padding: 0;
        margin: 0 auto; /* Centers the UL if it's narrower than its container */
        display: flex !important; /* Ensure flex display */
        flex-direction: row !important; /* Ensure horizontal layout */
        justify-content: center !important; /* Center the group of items */
        align-items: center !important; /* Vertically align items */
        flex-wrap: wrap !important; /* Allow wrapping */
        gap: 20px 15px !important; /* Spacing */
        /* Reset potential Swiper inline styles on the wrapper */
        transform: none !important;
        padding-bottom: 0 !important; /* No extra padding for mobile pagination */
    }

    .hero-benefits-bar .hero-benefits-list .swiper-slide { /* This is the LI */
        display: flex !important; /* Keep icon and text aligned */
        align-items: center !important;
        font-size: 14px;
        color: #333;
        width: auto !important; /* CRITICAL: Allow item to size by content */
        flex-shrink: 0 !important; /* Prevent shrinking if you want them to maintain size */
        margin-right: 0 !important; /* Reset Swiper's potential slide margins */
        text-align: left;
        /* Ensure other Swiper transform/opacity styles are reset if needed */
        opacity: 1 !important; 
        transform: none !important;
    }

    .hero-benefits-bar .hero-benefits-list .swiper-slide svg {
        margin-right: 8px;
        flex-shrink: 0;
        width: 15px;
        height: 15px;
    }

    .hero-benefits-bar .hero-benefits-slider .hero-benefits-pagination {
        display: none !important; /* Ensure pagination is hidden on desktop */
    }
}
/* === END DESKTOP STYLES === */


/* General styles for LI content (SVG and text) - applies to both mobile and desktop */
.hero-benefits-bar .hero-benefits-list .swiper-slide {
    display: flex; 
    align-items: center; 
    font-size: 14px;
    color: #333;
}
.hero-benefits-bar .hero-benefits-list .swiper-slide svg {
    margin-right: 8px;
    flex-shrink: 0;
    width: 15px;
    height: 15px;
}
.hero-benefits-bar .color--highlight {
    /* Your theme's style for this class will apply */
}


/* --- Mobile Slider Specific Styles (max-width: 767px) --- */
@media (max-width: 767px) {
    
    .hero-benefits-bar { background-color: #fff; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 9px 0px; }
    .hero-benefits-bar .hero-benefits-slider {
        overflow: hidden; /* Needed for Swiper */
    }

    .hero-benefits-bar .hero-benefits-list { /* This is the swiper-wrapper on mobile */
        display: flex; /* Ensured by Swiper */
        flex-direction: row; /* Ensured by Swiper */
        justify-content: flex-start; /* Swiper aligns slides to the start */
        flex-wrap: nowrap; /* Essential for Swiper */
        gap: 0; /* Swiper's `spaceBetween` option handles gaps */
        padding-bottom: 25px; /* Make space for pagination dots */
        margin: 0; /* Reset any auto margins from desktop */
    }

    .hero-benefits-bar .hero-benefits-list .swiper-slide { /* This is the LI */
        width: 100% !important; /* Slide takes full width of the Swiper container, override auto from desktop */
        justify-content: center; /* Center the SVG and text within the slide */
        padding: 10px 15px;
        box-sizing: border-box;
        text-align: center;
        margin-right: 0 !important; /* Reset from Swiper spaceBetween for the last item in loop */
        opacity: 1 !important; /* Ensure visible */
        transform: none !important; /* Reset any stray transforms */
    }

    .hero-benefits-bar .hero-benefits-list .swiper-slide span {
        text-align: center;
    }

    .hero-benefits-bar .hero-benefits-slider .hero-benefits-pagination {
        display: block !important; /* Show pagination on mobile */
        position: absolute;
        bottom: -5px;
        left: 50%;
        transform: translateX(-50%);
        width: auto !important;
    }

    .hero-benefits-bar .hero-benefits-slider .hero-benefits-pagination .swiper-pagination-bullet {
        background-color: #007bff;
        opacity: 0.5;
        width: 7px;
        height: 7px;
        margin: 0 4px !important;
    }

    .hero-benefits-bar .hero-benefits-slider .hero-benefits-pagination .swiper-pagination-bullet-active {
        opacity: 1;
        background-color: #0056b3;
    }
}
.cart-tips h4 { margin-top: 30px; }
.cart-tips a { text-decoration: underline;}
.map-responsive { overflow: hidden; padding-bottom: 56.25%; position: relative; height: 0; }
.map-responsive iframe { left: 0; top: 0; height: 100%; width: 100%; position: absolute; }
.main-menu ul>li { position: static; }
.main-menu ul>li>a:hover, .main-menu ul>li>a:hover, .main-menu ul>li .dropdown-item>a:hover, .main-menu ul>li .dropdown-item>a:focus { border-bottom: 2px solid #e10817; background: #ddd; background-color: #ddd; }
.main-menu .dropdown-item:hover .dropdown-item-menu { display: block; }
.main-menu .dropdown-item-menu { z-index: 99; display: none; position: absolute; left: 0px; top: 59px; overflow: hidden; padding: 30px 30px 20px 30px; width: 100%; background: #fff; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.main-menu .dropdown-item-menu h4 { margin: 0px; padding-bottom: 15px; font-size: 14px; color: #25221f;font-weight: bold; text-transform: uppercase; }
.main-menu .dropdown-item-menu .col1 { width: 28%; float: left; }
.main-menu .dropdown-item-menu .image { padding: 10px; overflow: hidden; width: 260px;  border: 6px solid #f8f8f8; }
.main-menu .dropdown-item-menu .image strong { font-size: 14px; color: #ddd; text-transform: uppercase; }
.main-menu .dropdown-item-menu .image .img { padding: 24px 0px; text-align: center;  width: 100%; }
.main-menu .dropdown-item-menu .image .img img { display: inline-block; width: 100%; }
.main-menu .dropdown-item-menu .image .discount { width: 78px;  height: 34px; font-size: 14px; color: #fff; text-align: center; float: left; line-height: 34px; display: block; background: #ff6600; }
.main-menu .dropdown-item-menu .image .price { width: 107px; height: 34px; line-height: 32px; border: 1px solid #f8f8f8; font-size: 14px; color: #26221f; font-weight: bold; display: block; text-align: center; float: right; }
.main-menu .dropdown-item-menu .col2 { width: 36%; float: left; }
.main-menu .dropdown-item-menu .link { width: 50%; float: left; }
.main-menu .dropdown-item-menu .link ul { margin-bottom: 15px; list-style: none; padding: 0; }
.main-menu .dropdown-item-menu .link li { line-height: 30px; width: 100%; }
.main-menu .dropdown-item-menu .link li>a { font-family: "DM Sans", sans-serif;font-size: 14px;color:#25221f;text-decoration:none;font-weight:400;text-transform:capitalize;border:none;background:transparent;padding:0; }
.main-menu .dropdown-item-menu .link li a:hover { text-decoration: underline; border: none; }
.main-menu .dropdown-item-menu p { font-size: 14px; line-height: 28px; }
@media only screen and (max-width: 1024px) {
    .main-menu .dropdown-item-menu .image { width:168px; }
}
.mobile-header { position:relative;width:100%;background:#ddd;overflow:hidden;padding:20px; }
.mobile-header .btn.btn-link { color:#fff;width:36px;height:36px;line-height:36px;font-size:18px;padding:0; }
.mobile-header .btn.btn-default { color:#fff;height:36px;line-height:36px;display:block;font-size:10px;text-transform:uppercase;border:1px solid #747474;background-color:transparent;border-radius:0;padding:0 10px; }
.mobile-header .btn.btn-default:focus { outline: none; }
.mobile-header .brand { width: 136px; margin: 0px auto; }

@media only screen and (max-width: 479px) {
    .tabBox ul.tabs li a { 
        font-size: 16px !important;
        padding: 9px 6px !important;
        font-weight: normal !important; 
    }
}

@media only screen and (max-width: 390px) {
    .tabBox ul.tabs li a { 
        font-size: 14px !important;
        padding: 9px 5px !important;
        font-weight: normal !important;
    }
    .r-tabs .r-tabs-nav, .r-tabs .r-tabs-accordion-title { margin-bottom: 0px; }
}

@media only screen and (max-width: 360px) {
    .mobile-header .brand { width:115px; }
    .mobile-header .brand img { width:100%!important;margin:0 auto; }
    .support-header { display:none; }
    .tabBox ul.tabs li a { font-size: 12px!important; padding: 9px 4px!important; font-weight: bold!important; }
}

@media only screen and (max-width: 342px) {
    .mobile-header .brand { width: 95px; }
}

@media only screen and (max-width: 320px) {
    .tabBox ul.tabs li a { font-size: 11px !important; }
}

.fancy-share .heading img { float: left; max-width: 25px; }
.fancy-share .close-btn { float: right; text-decoration: none; }
.fancy-share .btn { border-radius: 25px; width: 100%; margin-top: 10px; }
.fancy-share input[type="text"],.fancy-share input[type="email"] { padding: 20px; }
.fancy-share .btn.btn-success { color: #ffffff; background-color: #27ba7a; }
.fancy-share .jumbotron,.fancy-share .jumbotron.col-md-3,.fancy-share .jumbotron.col-md-4 { background: none; border: 1px solid #474747; }
.fancy-share .phone-text  { color: white; }
.fancy-save .heading img { float:left; }
.copy-message { font-size: 14px; border-radius: 25px; border-color: #27ae60; color: #fff; background: #27ae60;  padding: 10px;  width: 100%; display: block; text-align: center; opacity: 0; transition:background .1s linear; margin-top: 5px; }
.copy-message.show-message { opacity: 1; }
.mobile-header .account-buttons{ position:absolute;right:20px;top:20px; }
.fancy-share .heading h3,.fancy-save .heading h3 { font-weight:700;font-size:22px;margin:0;padding:0 0 10px; }
.mobile-header .account-buttons .btn.btn-link { background: #676767; color: #fff; width: 36px; height: 36px; line-height: 36px; border-radius: 100%; }
.mobile-header .account-buttons .btn.btn-link { background: #676767; color: #fff; width: 36px; height: 36px; line-height: 36px; padding: 0; font-size: 18px; border-radius: 100%; }
.mobile-menu .panel-group {  position: relative;  top: -20px;  z-index: 100;  margin: 0; }
.mobile-menu .panel-group .panel { margin: 0; border-radius: 0; background-color: transparent; border: 0; box-shadow: none; position: absolute; top: 0px; left: 0; background: rgba(0, 0, 0, 0.9); width: 100%; color: #fff; }
.mobile-menu .panel-group .panel ul.menu-items { padding: 0px 0px 100px 0px; }
.mobile-menu .panel-group .panel ul.menu-items .dropdown-menu { position: static; }
.mobile-menu .panel-group .panel ul.menu-items li { display: block; border-bottom: 1px solid #ddd; }
.mobile-menu .panel-group .panel ul.menu-items li a { display: block; padding: 0px 0px 0px 90px; position: relative; font-family: "DM Sans", sans-serif; line-height: 48px; font-size: 14px; color: #fff; text-decoration: none; }
.mobile-menu .panel-group .panel ul.menu-items li a:hover, .mobile-menu .panel-group .panel ul.menu-items li.active a { background: #e10717; color: #ffffff; }
.mobile-menu .panel-group .panel ul.menu-items li a:before { position: absolute; left: 48px; top: 10px; }
.mobile-menu .panel-group .panel ul.menu-items li .dropdown-menu { width: 100%; background: transparent; padding: 0; margin: 0; border: 0; border-radius: 0; box-shadow: none; -webkit-box-shadow: none; float: none; background-color: #000; }
.mobile-menu .panel-group .panel ul.menu-items li.dropdown:before { z-index:1;position:absolute;left:20px;top:0;font-family:FontAwesome;content:"\f107";font-size:28px;color:#fff; }
.mobile-menu .panel-group .panel ul.menu-items li .dropdown-menu a:before { z-index:1;position:absolute;left:50px;top:0;font-family:FontAwesome;content:"\f105";font-size:28px;color:#fff; }
.menu_link li.dropdown ul { display:none; }
.menu_link li.dropdown ul li a:before { z-index:1;position:absolute;left:43px;top:0;font-family:FontAwesome;content:"\f105";font-size:28px;color:#fff; }
.mobile-menu .panel-group .panel ul.menu-items li a.home:before { top:0;font-family:FontAwesome;content:"\f015";font-size:28px;color:#fff; }
.mobile-menu .panel-group .panel ul.menu-items li a.tool:before { width:28px;height:28px;display:block;content:'';background:url(/game_computer_store/img/tool.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.support:before { width:28px;height:28px;display:block;content:'';background:url(/game_computer_store/img/svg/support-white.svg) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.laptop:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/laptop.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.music:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/music.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.flower:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/flower.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.contact:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/contact.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.betalen:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/black-and-white-credit-cards.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.verzenden:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/small-truck.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.retourneren:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/recycable.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.faq:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/speech-bubble-with-question-mark.png) left top no-repeat; }
.mobile-menu .panel-group .panel ul.menu-items li a.contact2:before { width:29px;height:28px;display:block;content:'';background:url(/game_computer_store/img/address-book-contacts.png) left top no-repeat; }
.mobile-header .btn .count { position: absolute; right: 0px; top: -12px; font-size: 14px; color: #fff; line-height: 22px; text-align: center; width: 22px; height: 22px; display: block; background: #e10717; border-radius: 100%; }
.container:before, .container:after { content: " "; display: table; }
.container:after { clear: both; }
.product-image { margin-top: -100px; }
@media (min-width: 768px) {
    .container { width: 750px; }
}
@media (min-width: 992px) {
    .container { width: 970px; }
}
@media (min-width: 1200px) {
    .container { width: 1170px; }
}
.container { width:100%;max-width:1280px;margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px; }
.container.extra-top { padding-bottom: 30px; padding-top:30px; }
.container-fluid { margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px;max-width:1280px; }
.container .heading p { margin-bottom: 0px; font-size: 18px;color: #c4c4c4; }
.container .heading h1 { line-height:1;font-weight:700;font-size:31px;margin-bottom: -10px; font-optical-sizing: auto; font-style: normal; font-stretch: normal; line-height: initial; }
.container-fluid:before,.container-fluid:after,.row:before,.row:after { content:" ";display:table; }
.container-fluid:after,.row:after { clear:both; }
.row { margin-left:-15px;margin-right:-15px; }

@media (max-width: 768px) {
    .header .btn-toolbar .search { width:150px;margin:0 20px 0 0; }
    .page { margin-top:20px; }
    .listing,.support,.support-header { display:none; }
    .featured-set .composeBox { margin-bottom: 20px; }
    .row.top-padding { padding: 0px 0px 25px 0px!important; }
    .container-fluid { margin-top: 9px; }
}
.row.top-padding { padding: 25px 0px 25px 0px; }
.slick-dots li:only-child { display:none; }
.slick-prev.slick-arrow:hover,.slick-next.slick-arrow:hover { text-decoration:none;color:#fff; }
.slick-prev.slick-arrow{ position:absolute;top:-20px;right:52px;width:35px;height:35px; border-radius: 25px; }
.slick-next.slick-arrow{ position:absolute;top:-20px;right:10px;width:35px;height:35px; border-radius: 25px; }
.slick-next:after { content:"\f054"; }
.slick-prev:after { content:"\f053"; }
.slick-prev:after,.slick-next:after{height:30px;width:30px;font-size: 13px;line-height:2.7;font-family:FontAwesome;opacity:.75;color:#0090e2; }
.slick-prev:hover:after,.slick-next:hover:after{text-decoration:none;color:#0090e2; }
.slick-prev,.slick-next { font-size:0;line-height:0;position:absolute;top:50%;display:block;width:20px;height:20px;margin-top:-10px;cursor:pointer;color:transparent;outline:none;border:1px solid #ddd;background:#fff;padding:0; }
.slick-disabled { opacity: 0.25; }
.featured-set { margin-top: 0px; }
.featured-set .composeBox { width:100%; }
.featured-set .composeBox h2, .featured-set .composeBox h2 a { float:left;font-size:22px;font-weight:700;margin:10px 0px 0px 0px; padding:0px; color: #285dab; text-decoration: none; }
.featured-set .composeBox h2 span { 
    display: block;
    line-height: 12px;
    clear: both;
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    margin-top: 3px;
    padding: 0px; 
}

.featured-set .composeBox>ul { list-style:none;clear:both;margin:0 -10px;padding:0; }
.featured-set .rate-pay-banner { width:100%;height:32px;margin:-10px 0 20px;padding:4px 15px; }
.featured-set .composeBox>ul>li,.featured-set .composeBox>ul .slick-list li { width:33%;float:left;position:relative;box-sizing:border-box;margin:0;padding:0 10px; }
.featured-set .composeBox>ul .slick-list li .rating li { width:24px;float:none;display:inline-block;margin-right:1px;padding:0; }
.featured-set .composeBox>ul .slick-list { padding:2px 0 0 1px; min-height: 430px; }
.featured-set .composeBox .image img { width:100%;max-width:180px;display:block;margin:0 auto; }
.featured-set .composeBox .price { font-size:18px;display:block;font-weight:700;margin-top:2px;color:#111; }
.featured-set .composeBox .price span { padding-left:8px;font-size:16px;color:#bebebe;font-weight: 500; }
.featured-set .composeBox h3 a,.featured-set .composeBox h4 a { display:block;font-family: "DM Sans", sans-serif;font-size:16px;font-weight:700;text-decoration:none;margin:0 0 5px; }
.featured-set .composeBox h3 a:hover,.featured-set .composeBox h4 a:hover { color:#e10817;text-decoration:none; }
.featured-set .composeBox p { font-size: 14px;line-height:23px;clear:both; }
.featured-set .najprodavanije { text-align:center; margin-top:0px; padding:0; font-size: 14px; }
.featured-set .black-friday { text-align:center; margin-top:5px; margin-bottom: 5px; padding:0; font-size: 14px; }
.featured-set .composeBox p.zelen { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #1cf98b; }
.featured-set .composeBox p.orange { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #ff5400;}
.featured-set .composeBox p.plav { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #0097ff; }
.featured-set .composeBox p.budget { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #ff6000; }
.featured-set .composeBox p.purple { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #ae00ff; }
.featured-set .composeBox p.yellow { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #ffd200; }
.featured-set .composeBox p.red { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #ff1212; }
.featured-set .composeBox p.black { margin: 0px; padding: 0px; color: #111; border-radius:25px; border: 1px solid #fff; }
.featured-set .composeBox p.grey { margin: 0px; padding: 0px; color: yellow; border-radius:25px; border: 1px solid yellow; }
.featured-set .composeBox .subtitle { font-size:18px;color:#004572;padding:0 0 10px; }
.featured-set .composeBox a.stelsamen { position:absolute;bottom:20px;width:calc(100%-40px);display:block;padding:9px 12px; }
.featured-set .composeBox li:hover a.stelsamen,.featured-set .composeBox li a.stelsamen:hover { background:#95d742;transition:background .1s linear; }
.featured-set .composeBox li.active a { background-color:#29cb85; }
.featured-set .composeBox .pctop li { width:25%;padding:0 9px 0 0; }
.featured-set .composeBox li:hover .subtitle,.featured-set .composeBox li.active .subtitle,.featured-set .composeBox li.active strong { color:#29cb85; }
.featured-set .composeBox .pctop li .block { padding: 26px 21px 10px 21px; background: #fff; -webkit-box-shadow: 0px 0px 4px 3px #f4f3f3; box-shadow: 0px 0px 4px 3px #f4f3f3; }
.featured-set .composeBox .pctop li h2 { font-size:17px;color:#004572;min-height:57px;padding:0 0 10px; }
.featured-set .composeBox .pctop li h2.pcs { min-height:26px!important;margin:0; }
.featured-set .composeBox .pctop li h2 a { color:#004572; }
.featured-set .composeBox .pctop li h2 a:hover { color:#12aaeb;text-decoration:none; }
.featured-set .compare-products { left: -130px; margin-top: 30px !important; }
.featured-set .product .ups { clear: both; margin-top: 0px!important;  }

@media only screen and (max-width: 767px) {
    .featured-set .composeBox>ul>li { width:100%; }
    .featured-set .composeBox>ul .slick-list { padding:0px; }
    .featured-set .composeBox h2 { padding:0px; }
    .featured-set .product .ups {        
        margin-top: 12px !important;
        /*margin-left: 200px;*/
        font-size: 14px;
    }
    .featured-set .composeBox .slick-dots { display: none !important; }
}

@media only screen and (max-width: 430px) { 
    .featured-set .product .ups {        
        margin-top: 5px !important;
    }
}


@media only screen and (max-width: 390px) { 
    .featured-set .product .ups {
        margin-top: -1px !important;
        margin-left: 170px;
        font-size: 14px;
    }
}

@media only screen and (max-width: 360px) {
    .featured-set .product .ups {        
        margin-top: 4px!important;
        margin-left: 146px!important;
        font-size: 14px!important;
    }
    .compare-products .uporedi {
        margin-left: 166px!important;
        margin-top: 360px!important;
    }
    .product .btn {
        margin-top: 57px!important;
        min-width: 64px!important;
        min-height: 48px!important;
    }
    
}


@media only screen and (max-width: 320px) {
    .featured-set .product .ups {        
        margin-top: 4px !important;
        margin-left: 105px !important;
        font-size: 14px !important;
    }
    .compare-products .uporedi {
        margin-left: 166px !important;
        margin-top: 351px !important;
    }
}

.featured-product-container {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 20px 20px 0px 20px;
    margin-top: 80px;
}

.featured-product-container .compare-item { margin-top: 215px; }


.featured-product-container h6 {
    margin: 0px;
    font-size: 20px;
    font-weight: 600;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
}

@media only screen and (max-width: 767px) {
    .featured-product-container {
        margin-top: 110px;
        padding: 20px 10px 0px 10px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .featured-product-container .product.coolblue-style.mobile-layout { border-bottom: none!important; }
    .featured-product-container .energylabel { margin-top: 125px!important; }
}

@media only screen and (max-width: 343px) {
    .featured-product-container .energylabel { display: none; }
    .featured-product-container .product.coolblue-style.mobile-layout .product-right .add-to-cart-form { display: none; }
    .featured-product-container .product.coolblue-style.mobile-layout .product-right { margin-top: -10px; }
    .product.coolblue-style.mobile-layout .energylabel { margin-top: 145px !important; }
    .cart-offers .parts li .image-column { max-width: 80px!important; }
}

@media only screen and (max-width: 390px) {
    .featured-product-container .energylabel { display: none; }
    .featured-product-container .product.coolblue-style.mobile-layout .short-desc { padding-bottom: 0px!important; margin-bottom: 0px!important; color:#ababab;}
    .featured-product-container .product.coolblue-style.mobile-layout .short-desc p { color:#ababab;}

}

/* --- Brand Showcase Bar Styling --- */
.brand-showcase-bar {
    padding: 30px 20px 30px 0px;
    background-color: #ffffff; /* Or your desired background */
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    position: relative; /* For absolutely positioned arrows if they are outside .brand-logo-scroller */
}

.brand-showcase-title {
    text-align: center;
    font-size: 22px;
    font-weight: 900;
    color: #333;
    margin-bottom: 25px;
}

.brand-showcase-bar .brand-logo-scroller { /* Swiper container */
    position: relative; /* For nav buttons if they are inside */
    overflow: hidden;
    margin: 0 auto; /* Center the slider if using padding for arrows */
    /* Add padding if arrows are positioned inside the container bounds but outside slides */
    padding-left: 30px; /* Space for prev arrow */
    padding-right: 30px; /* Space for next arrow */
}

.brand-showcase-bar .brand-logo-list { /* This is the UL, swiper-wrapper */
    list-style: none;
    padding: 0;
    margin: 0;
    /* Swiper applies: display: flex; align-items: center (default); */
}

.brand-showcase-bar .brand-logo-list .brand-logo-item.swiper-slide { /* This is the LI */
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    text-align: center;
    /* width: auto; Swiper handles slide width based on slidesPerView or 'auto' */
    flex-shrink: 0; /* Good for slidesPerView: 'auto' */
}

.brand-showcase-bar .brand-logo-list .brand-logo-item img {
    max-height: 45px; /* Consistent max height for logos */
    max-width: 120px; /* Prevent very wide logos from taking too much space */
    width: auto;      /* Maintain aspect ratio */
    height: auto;     /* Let height adjust based on width and max-height */
    opacity: 1;
    transition: opacity 0.3s ease;
    object-fit: contain; /* Ensures entire logo is visible */
    padding: 5px; /* Add a little space around the logo itself if needed */
}

.brand-showcase-bar .brand-logo-list .brand-logo-item img:hover {
    opacity: 0.8;
}

/* Swiper Navigation Arrows Styling */
.brand-showcase-bar .brand-logo-scroller .swiper-button-next,
.brand-showcase-bar .brand-logo-scroller .swiper-button-prev {
    color: #007bff; /* Your theme color or a neutral grey */
    width: 27px;    /* Default Swiper arrow size */
    height: 44px;   /* Default Swiper arrow size */
    margin-top: -22px; /* Half of height for vertical centering */
    /* Adjust position if you added padding to .brand-logo-scroller */
    /* Swiper positions them absolutely. If padding on .brand-logo-scroller: */
    /* For prev arrow */
    /* left: 5px; */
    /* For next arrow */
    /* right: 5px; */
}
.brand-showcase-bar .brand-logo-scroller .swiper-button-next::after,
.brand-showcase-bar .brand-logo-scroller .swiper-button-prev::after {
    font-size: 22px; /* Adjust icon size */
    font-weight: bold;
}

/* Hide arrows on very small mobile if they feel too cluttered */
@media (max-width: 480px) {
    .brand-showcase-bar .brand-logo-scroller {
        padding-left: 5px; /* Less space if arrows are smaller or hidden */
        padding-right: 5px;
    }
    .brand-showcase-bar .brand-logo-scroller .swiper-button-next,
    .brand-showcase-bar .brand-logo-scroller .swiper-button-prev {
        /* display: none; /* Uncomment to hide arrows on very small screens */
        /* Or make them smaller */
        width: 20px; height: 30px; margin-top: -15px;
    }
     .brand-showcase-bar .brand-logo-scroller .swiper-button-next::after,
     .brand-showcase-bar .brand-logo-scroller .swiper-button-prev::after {
        font-size: 18px;
    }
}





.homeseo { padding-bottom:.625rem; margin-bottom: 1.875rem; border-radius: 5px; border: 1px solid #262626; padding: 30px; margin-top: 20px; }
.homeseo .container { padding-left:0;padding-right:0; }
.homeseo h3 { font-weight:700;font-size:22px;margin-bottom:10px; }
.homeseo figure img { opacity: 0; }
.homeseo__content { display: flex; align-items: stretch; background: #0e0e0e; margin-top: 10px; }
.homeseo__content figure  { width: 50%;background-size: cover;background-repeat: no-repeat;background-position: center center; }
.homeseo__content img  { margin-right: 20px; }
.homeseo__content .purchase__text  { width: 50%;padding: 0px 10px 0px 0px;line-height: 21px; font-size: 14px; color: #111; }
.homeseo h4 { font-weight:700;margin-bottom:10px;font-size:18px;color:#fff; }
.homeseo__text { width:50%; line-height:21px;padding: 0px 10px 10px 10px; }
.homeseo__text h4 { font-weight:700;margin-bottom:10px;font-size:18px; }
.homeseo__text p { line-height:21px;margin:0px 0px 10px 0px; font-size: 14px; }
.homeseo a { color:#f60;text-decoration:none;font-weight: 900; font-size: 14px; }
@media only screen and (max-width: 767px) {
    .homeseo__content { display:block;width:100%; }
    .homeseo__content figure { width:100%!important; }
    .homeseo__text h4  { font-size:20px; }
    .homeseo__content .purchase__text,.homeseo__text { width:100%!important;clear:both;font-size: 14px; }
}

.categoryBox { border-radius: 5px; }
.categoryBox .bottom-extra { padding-bottom: 40px; }
.categoryBox .bottom-extra ul { padding-left: 15px; }

/*.categoryBox { padding-bottom:40px; margin-bottom: 40px; border-radius: 5px; padding: 30px; }*/
.categoryBox h2 { font-weight:700; font-size:20px; margin-bottom:10px; color:#285dab; font-family: "Roboto Slab", serif; }
.categoryBox h3 { 
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    float: left;
    padding-bottom: 10px;
    clear: both;
    width: 100%; 
}
.categoryBox p { line-height:22px; margin:0px; font-size: 14px; color:#111; }
.categoryBox img { margin-bottom: 10px; }
.categoryBox li { list-style: circle; }
@media only screen and (max-width: 476px) {
    .categoryBox { border: none!important; padding: 15px; line-height: 20px; }
    .no-padding { padding: 0px!important; }
    .categoryBox .bottom-extra { padding-bottom: 40px; padding-left: 0px!important; padding-right: 0px!important; }
}

.promo-item-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1260px;
    margin: auto;
    margin-top: 30px;
    margin-bottom: 30px;
}

.promo-item {
    position: relative;
    overflow: hidden;
    border-radius: 5px;
    color: white;
    height: 400px;
}

.promo-item img.background {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.promo-item .text-content {
    position: absolute;
    bottom: 20px;
    left: 20px;
    z-index: 2;
    padding-right: 20px;
}

.promo-item .logo {
    position: absolute;
    top: 20px;
    left: 20px;
    max-width: 100px;
    z-index: 3;
}

.promo-item .label {
    background-color: #ff6600;
    padding: 5px 10px;
    font-size: 13px;
    font-weight: bold;
    display: inline-block;
    border-radius: 4px;
    margin-bottom: 10px;
}

.promo-item h2 {
    font-family: "Roboto Slab", serif;
    margin: 0;
    font-size: 22px;
}

.promo-item p {
    margin: 0px 0 0;
    font-size: 1rem;
}

.promo-item a {
    color: white;
    text-decoration: none;
}

.promo-item span.text-muted.oblique-striketrough { color:#fff!important; }

.promo-item a:hover {
    text-decoration: underline;
}

.arrow-after::after {
    content: ' →';
    display: inline-block;
    margin-left: 5px;
    transition: margin-left 0.2s;
}

.promo-item a:hover .arrow-after::after {
    margin-left: 10px;
}

.discount-tag {
    position: absolute;
    background-color: #ff6600;
    color: white;
    padding: 8px 12px;
    font-weight: bold;
    z-index: 2;
    border-radius: 4px;
    font-size: 0.9rem;
}

.tag-10 { top: 30px; left: 10px; transform: rotate(-15deg); }
.tag-30 { top: 185px; left: 20px; transform: rotate(-15deg); }
.tag-20 { top: 120px; right: 20px; transform: rotate(15deg); }

.swiper-promo-item-container {
    width: 100%;
    height: 100%;
    position: relative;
}

.swiper-wrapper, .swiper-slide {
    height: 100%;
}

.swiper-pagination-promo {
    position: absolute;
    bottom: 0;
    width: 95%!important;
    display: flex;
    gap: 3px;
    padding-left: 15px;
    z-index: 10;
}

.swiper-bullet-promo {
    flex-grow: 1;
    height: 4px;
    border-radius: 5px;
    background-color: #e0e0e0;
    opacity: 1;
    margin: 0 !important;
}

.swiper-bullet-promo-active {
    background-color: #285dab;
}

@media (max-width: 992px) {
    .promo-item-container {
        grid-template-columns: repeat(2, 1fr);
        margin-top: 10px;
    }
}

@media (max-width: 768px) {
    .promo-item { 
        margin-right: 10px;
        margin-left: 10px; 
        margin-bottom: -20px;
    }
    .promo-item-container {
        grid-template-columns: 1fr;
    }
}
        
.bezBox { width:100%;overflow:hidden;border:1px solid #ddd;clear:both;padding:28px; }
.bezBox h2 { font-size:22px;color:#e10817;font-weight:700;margin:0; }
.bezBox h3 { font-size: 14px;font-weight:700;margin:0;padding:8px 0 10px; }
.bezBox ul.right { padding:0 20px 0 0; }
.bezBox ul { list-style:none;padding:0; }
.bezBox li { line-height:26px; }
.bezBox li a { position:relative;font-family: "DM Sans", sans-serif;font-size: 14px;color:#fff;text-decoration:none;padding:0 0 0 18px; }
.bezBox li a:before { position:absolute;left:0;top:-3px;font-family:FontAwesome;content:"\f105";font-size:18px; }
.bezBox li a:hover { text-decoration:underline; }
.bezBox p { font-size: 14px;color:#333;margin:0; }
.bezBox ul.list{list-style:none; }
.bezBox ul.list li { position:relative;font-size: 14px;color:#fff;padding:5px 0 0 23px; }
.bezBox ul.list li:before { position:absolute;left:0;top:5px;font-family:FontAwesome;content:"\f00c";font-size:18px;color:#29cb85; }
.supportBox { margin-bottom:20px;position:relative;width:100%;padding-top:3px; }
.supportBox h3 { padding-bottom:10px;font-size:22px;color:#333;font-weight:700;margin:0; }
.supportBox h4 { padding-bottom:5px;font-size:18px;color:#333;font-weight:700;margin:0; }
.supportBox .product_name { font-size: 14px;color:#727272;display:block; }
.supportBox .block { overflow:hidden;border:1px solid #ddd;padding:22px 0 38px 12px; }
.supportBox .phone { font-size:16px;color:#ff6348;font-weight:700; }
.supportBox .phone:before { width:21px;height:21px;display:inline-block;content:'';float:left;background:url(/game_computer_store/img/svg/phone.svg) left top no-repeat;margin:2px 5px 0 0; }
.supportBox p.help { font-size: 14px;color:#333;border:1px solid #ddd;background:#f6f6f6;margin:1px 0;padding:10px 4px 10px 12px; }
.supportBox p.help2 { font-size: 14px;color:#333;border-left:1px solid #ddd;border-right:1px solid #ddd;background:#f6f6f6;margin:0;padding:10px 4px 10px 12px; }
.supportBox .chat{ position:relative;font-size: 14px;color:#333;border:1px solid #ddd;margin:0;padding:10px 13px 10px 52px; }
.supportBox .chat:before { position:absolute;left:13px;top:8px;display:inline-block;content:'';width:29px;height:30px;background:url(/game_computer_store/img/svg/chat-online.svg) 0 0 no-repeat; }
.supportBox .chat a { color:#29cb85;text-decoration:none;font-weight:700; }
.supportBox img { position:absolute;right:23px;top:-11px; }
.supportBox .image.call_image{top:3px;right:10px; }
@media only screen and (max-width: 1111px) {
    .supportBox img { right: 0px;  }
}

.popularne-kategorije { display: flex; flex-direction: column; align-items: center; width: 100%; margin-bottom: 20px; }
.popularne-kategorije h3 { font-size: 23px; margin: 0; padding: 20px; text-align: center; color: #285dab; }
.popularne-kategorije h3 span { 
    /*display:block;line-height:22px;font-weight:400;clear:both;font-size: 14px;color:#111;margin:0;padding:3px 0 0; */
    display: block;
    line-height: 22px;
    clear: both;
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    margin-top: 3px;
    
}

.popularne-kategorije ul { list-style: none; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; }
.popularne-kategorije .card-list__item { color:#fff; margin: 0 1rem; text-align: center; min-width: 170px; border: 1px solid #ddd; border-radius: 5px; transition: 0.3s ease-in-out; }
.popularne-kategorije .card-list__item:hover { color:#f60; opacity: 0.8; border: 1px solid #4e4e4e; transition: 0.3s ease-in-out; }
.popularne-kategorije .card-category { display: flex; flex-direction: column; align-items: center; text-decoration: none;  color: inherit; }
.popularne-kategorije .card-category img { max-width: 150px; height: auto; padding-top: 30px; transition: all ease-in-out 300ms; }
.popularne-kategorije .card-list__item:hover .card-category img {
  transform: scale(1.1); transition: all ease-in-out 300ms;
}
.popularne-kategorije .card-category__title { margin: 0.5rem 0; font-size: 14px; font-weight: normal; }

.card-category__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem; /* optional spacing between text and arrow */
  position: relative;
}

.card-category__title .svg-icon {
  width: 10px;
  height: auto;
  flex-shrink: 0;
  padding: 0px !important;
}


@media (max-width: 767px) {
    .popularne-kategorije ul { justify-content: center; }
    .popularne-kategorije .card-list__item { flex: 0 0 calc(33.333% - 2rem); margin: 0.5rem; }
    .popularne-kategorije h3 { font-size: 18px; }
}


@media (max-width: 390px) { 
    .popularne-kategorije .card-list__item { min-width: 150px; padding: 15px !important; }
}

@media (max-width: 360px) {
    .popularne-kategorije ul { justify-content: center; }
    .popularne-kategorije .card-list__item { flex: 0 0 calc(33.333% - 2rem); margin: 0.5rem; }
    .popularne-kategorije h3 { font-size: 18px; }
    .popularne-kategorije .card-list__item { min-width: 135px; max-width: 135px; }
    .popularne-kategorije .card-category img { max-width: 110px; height: auto; padding-top: 30px; }
}

@media (max-width: 320px) {
    .popularne-kategorije .card-list__item {
        min-width: 115px;
        max-width: 115px;
    }
}

.kategorije-benefiti {
  padding: 40px 0;
  background-color: #fff;
  text-align: center;
}

.usp-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
}

.kategorije-benefiti .usp-item {
  flex: 1 1 220px;
  max-width: 250px;
  padding: 15px;
}

.kategorije-benefiti .usp-item img {
  width: 48px;
  height: auto;
  margin: 0 auto 10px auto; /* this centers it horizontally */
  display: block; /* ensures margin auto works */
}

.kategorije-benefiti .usp-item h4 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 8px;
  color: #285dab;
}

.kategorije-benefiti .usp-item p {
  font-size: 14px;
  color: #444;
  margin-bottom: 10px;
}

.kategorije-benefiti .usp-item a {
  font-weight: bold;
  color: #285dab;
  text-decoration: none;
}

.kategorije-benefiti .usp-item a:hover {
  text-decoration: underline;
}


/* Modal Overlay */
#exit-intent-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    /* Increased z-index to ensure it's on top of other content */
    z-index: 99999;
}

/* Class to hide the modal */
.hidden {
    display: none;
}

/* Modal Content Box */
#modal-content {
    position: relative;
    background-color: #ffffff;
    width: 100%;
    max-width: 28rem; /* 448px */
    border-radius: 1rem; /* 16px */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    padding: 2rem;
    text-align: center;
    /* Animation properties are set here */
    opacity: 0;
    transform: translateY(-20px) scale(0.95);
    transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}

/* Animation for Modal fade-in and slide-down */
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Class to trigger the animation */
#exit-intent-modal:not(.hidden) #modal-content {
     animation: fadeInDown 0.3s ease-out forwards;
}

/* Close Button */
#close-modal-btn {
    position: absolute;
    top: 1rem; /* 16px */
    right: 1rem; /* 16px */
    color: #9ca3af; /* gray-400 */
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}
#close-modal-btn:hover {
    color: #1f2937; /* gray-800 */
}
#close-modal-btn svg {
    width: 1.5rem; /* 24px */
    height: 1.5rem; /* 24px */
}

/* Modal Typography */
#modal-content h4 {
    font-size: 1.5rem; /* 24px */
    font-weight: 700;
    color: #111827; /* gray-900 */
    margin: 0 0 0.5rem 0;
}
#modal-content .modal-text {
    color: #4b5563; /* gray-600 */
    margin: 0 0 1.5rem 0;
}
#modal-content .modal-text .highlight {
    font-weight: 700;
    color: #f60; /* indigo-600 */
}

/* Form Styling */
#subscribePopup fieldset {
    border: none;
    padding: 0;
    margin: 0;
}
.form-container {
    display: flex;
    flex-direction: column;
    gap: 0.75rem; /* 12px */
}

/* Responsive form layout for wider screens */
@media (min-width: 640px) {
    .form-container {
        flex-direction: row;
    }
}

#popupEmail {
    width: 100%;
    box-sizing: border-box;
    padding: 0.75rem 1rem; /* 12px 16px */
    border-radius: 0.5rem; /* 8px */
    border: 1px solid #d1d5db; /* gray-300 */
    transition: box-shadow 0.2s;
}
#popupEmail:focus {
    outline: none;
    box-shadow: 0 0 0 2px #6366f1; /* ring-2 ring-indigo-500 */
}

#submit-btn {
    width: 100%;
    background-color: #00b900; /* indigo-600 */
    color: white;
    font-weight: 600;
    padding: 0.75rem 1.5rem; /* 12px 24px */
    border: none;
    border-radius: 0.5rem; /* 8px */
    cursor: pointer;
    transition: background-color 0.2s, transform 0.2s;
}
#submit-btn:hover {
    background-color: #00b900; /* indigo-700 */
    transform: scale(1.05);
    opacity: 0.8;
}
#submit-btn:focus {
    outline: none;
    box-shadow: 0 0 0 2px white, 0 0 0 4px #4f46e5;
    opacity: 0.8;
}

@media (min-width: 640px) {
    #submit-btn {
        width: auto;
    }
}

/* Privacy Text */
#modal-content .privacy-text {
    font-size: 0.75rem; /* 12px */
    color: #9ca3af; /* gray-400 */
    margin-top: 1rem;
}


.advisor-stepper { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; padding-bottom: 10px; padding-top: 20px; border: 1px solid #eaeaea; max-width: 100%; margin-left: auto; margin-right: auto; border-radius: 5px; }
.step-indicator { display: flex; flex-direction: column; align-items: center; position: relative; flex-grow: 1; }
.step-indicator .step-circle { height: 30px; width: 30px; border-radius: 50%; background-color: #e0e0e0; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: bold; transition: background-color: 0.4s ease; z-index: 2; }
.step-indicator .step-label { margin-top: 8px; font-size: 14px; color: #666; transition: color 0.4s ease; }
.step-indicator.active .step-circle, .step-indicator.completed .step-circle { background-color: #0073b5; }
.step-indicator.active .step-label { color: #000; font-weight: bold; }
.step-indicator:not(:last-child)::after { content: ''; position: absolute; top: 15px; left: 95%; width: 100%; height: 2px; background-color: #e0e0e0; z-index: 1; transform: translateX(calc(-50% + 15px)); transition: background-color 0.4s ease; }
.step-indicator.completed::after { background-color: #0073b5; }
.advisor-step { display: none; }
.advisor-step.active { display: block; }
.advisor-nav-actions { display: flex; justify-content: space-between; margin-top: 30px; }
.advisor-nav-actions.center { justify-content: left; }
.advisor-button { padding: 7px 30px; font-size: 1em; font-weight: bold; color: #fff; background-color: #0073b5; border: none; border-radius: 5px; cursor: pointer; transition: background-color 0.3s; text-decoration: none; }
.advisor-button:hover { background-color: #0090e2; color: #fff; }
.advisor-button-secondary { background-color: #6c757d; }
.advisor-button-secondary:hover { background-color: #5a6268; }
.price-input-fields { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.price-input-fields .field { display: flex; align-items: center; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; }
.price-input-fields .field span { background-color: #f0f0f0; padding: 10px; font-weight: bold; }
.price-input-fields .field input { width: 100px; border: none; padding: 10px; font-size: 13px; text-align: left; }
.price-input-fields .field input:focus { outline: none; }
.price-slider-container { position: relative; height: 30px; }
.slider-wrapper { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; height: 5px; background: #ddd; border-radius: 5px; z-index: 1; }
.slider-progress { position: absolute; height: 100%; background: #0073b5; border-radius: 5px; left: 0%; right: 0%; }
.range-input { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; }
.range-input input { position: absolute; width: 100%; height: 100%; -webkit-appearance: none; appearance: none; background: none; pointer-events: none; }
.range-input input::-webkit-slider-thumb { height: 20px; width: 20px; border-radius: 50%; background: #0073b5; pointer-events: auto; -webkit-appearance: none; box-shadow: 0 0 6px rgba(0,0,0,0.1); cursor: pointer; }
.range-input input::-moz-range-thumb { height: 20px; width: 20px; border: none; border-radius: 50%; background: #0073b5; pointer-events: auto; -moz-appearance: none; box-shadow: 0 0 6px rgba(0,0,0,0.1); cursor: pointer; }
.advisor-modal-new { background-color: #fff; border-radius: 12px; max-width: 1260px; width: 100%; margin: 20px auto; box-shadow: 0 10px 30px rgba(0,0,0,0.1); overflow: hidden; font-family: 'DM Sans', sans-serif; }
.advisor-content-new { padding: 30px 40px; }
.advisor-header { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 25px; }
.advisor-header h2 { font-size: 26px; color: #285dab; font-weight: 700; margin-bottom: 5px; font-family: "Roboto Slab", serif; }
.advisor-header h3 { margin: 0; font-size: 16px; font-weight: 400; color: #0090e2; font-family: "Roboto Slab", serif; padding-bottom: 10px; }
.advisor-question { margin-bottom: 30px; padding: 30px; border: 1px solid #eaeaea; border-radius: 5px; }
.advisor-question-title { font-size: 19px; color: #285dab; font-weight: 700; margin-bottom: 5px; font-family: "Roboto Slab", serif; }
.advisor-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; }
.advisor-options label { display: flex; flex-direction: column; border: 1px solid #e0e0e0; border-radius: 8px; padding: 0; cursor: pointer; transition: all 0.2s ease-in-out; text-align: center; overflow: hidden; min-height: 245px; }
.advisor-options label:hover { border-color: #0073b5; transform: translateY(-2px); box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.advisor-options input[type="radio"] { display: none; }
.advisor-options input[type="radio"]:checked + label { border-color: #0090e2; box-shadow: 0 0 0 3px rgba(0, 115, 181, 0.2); background-color: #f8fcff; transform: translateY(-5px); }
.advisor-option-image { height: 150px; width: 100%; }
.advisor-option-image img { width: 100%; height: 100%; object-fit: cover; }
.advisor-option-content { padding: 15px; }
.advisor-option-text { margin: 0; font-size: 18px; font-weight: 500; color: #0090e2; font-family: "Roboto Slab", serif; padding-bottom: 0px; display: block; }
.advisor-option-description { font-size: 14px; color: #111; margin-top: 0px; margin-bottom: 0px; }
.advisor-actions { text-align: center; margin-top: 10px; }
.advisor-button-primary { padding: 0px 40px; font-size: 1.1em; font-weight: bold; color: #fff; background-color: #0073b5; border: none; border-radius: 5px; cursor: pointer; transition: background-color 0.3s; }
.advisor-button-primary:hover { background-color: #0090e2; color: #fff; transition: background-color 0.3s; }
.recommendation-wrapper { background-color: #fff; border-radius: 12px; max-width: 1260px; width: 100%; margin: 20px auto; padding: 30px 40px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); overflow: hidden; }
.recommendation-header { text-align: left; margin-bottom: 0px; }
.recommendation-header h2 { font-size: 26px; color: #285dab; font-weight: 700; margin-bottom: 0px; font-family: "Roboto Slab", serif; }
.recommendation-header p { margin: 0; font-size: 16px; font-weight: 400; color: #0090e2; font-family: "Roboto Slab", serif; padding-bottom: 10px; }
#tv-recommendation-result { scroll-margin-top: 100px; }
#custom-alert-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; z-index: 1000; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
#custom-alert-overlay.visible { opacity: 1; pointer-events: auto; }
#custom-alert-modal { background-color: #fff; padding: 30px 40px; border-radius: 12px; box-shadow: 0 5px 20px rgba(0,0,0,0.2); text-align: center; max-width: 400px; width: 90%; transform: scale(0.9); transition: transform 0.3s ease; }
#custom-alert-overlay.visible #custom-alert-modal { transform: scale(1); }
#custom-alert-message { font-size: 1.1em; color: #333; margin: 0 0 25px 0; line-height: 1.5; font-family: 'DM Sans', sans-serif; }
@media (max-width: 767px) { .advisor-modal-new, .recommendation-wrapper { width: 90%; padding-top: 0px; margin-top: 80px; } .advisor-header h2 { font-size: 21px; } .recommendation-header h2 { margin-top: 30px; font-size: 21px; } .recommendation-header p { line-height: 20px; } .advisor-question-title { font-size: 15px; } .step-indicator:not(:last-child)::after { left: 75%; } }

.advice-container { font-family: 'DM Sans', sans-serif; }
.advice-preferences { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; margin-top: 10px; padding-bottom: 20px; border-bottom: 1px solid #eee; }
.advice-pref-item { display: flex; align-items: center; background-color: #f0f8ff; color: #005a9e; padding: 5px 12px; border-radius: 20px; font-size: 0.9em; }
.advice-pref-item svg { width: 16px; height: 16px; margin-right: 8px; fill: #28a745; }
.advice-product-card { display: flex; flex-direction: column; gap: 20px; }
.advice-product-image { flex: 1; max-width: 100%; text-align: center; margin-top: -20px; }
.advice-product-image img { max-width: 100%; height: auto; object-fit: contain; margin-top: -20px; }
.advice-product-details { flex: 1.5; text-align: left; }
.advice-product-details h3 { font-size: 20px; color: #285dab; font-weight: 700; font-family: "Roboto Slab", serif; margin: 15px 0px 5px 0px; padding: 0px; }
.advice-product-details h3 a { font-size: 20px; color: #285dab; font-weight: 700; font-family: "Roboto Slab", serif; margin: 15px 0px 15px 0px; padding: 0px; text-decoration: none; }
.advice-product-price { font-size: 24px; color: #111; text-transform: uppercase; font-weight: 900; }
.advice-product-details .order { max-width: 300px; }
.advice-product-details .product-price { text-transform: uppercase; }
.advice-product-details .nas-izbor { width: 100%; float: left; clear: both; }
.advice-product-details .text-usp { margin-right: 10px; }
.advice-product-details .text-usp i { margin-right: 10px; }
.advice-product-details .nas-izbor { width: 100%; float: left; clear: both; margin-bottom: 20px; }
.nas-izbor .content-wrapper { display: flex; align-items: left; gap: 15px; }
.nas-izbor .image-container { flex-shrink: 0; }
.nas-izbor .badge-image { width: 70px; height: auto; }
.nas-izbor .text-container { flex-grow: 1; }
.nas-izbor .choice-text { font-weight: bold; margin: 0 0 5px 0; color: #333; }
.nas-izbor .choice-description { margin: 0; font-size: 0.9em; color: #555; line-height: 1.4; }
.advice-perfect-for-you { margin-bottom: 25px; width: 100%; float: left; clear: both; }
.advice-perfect-for-you h4 { font-size: 1.2em; margin-top: 0; margin-bottom: 10px; }
.advice-perfect-for-you ul { list-style: none; padding: 0; margin: 0; }
.advice-perfect-for-you li { display: flex; align-items: center; margin-bottom: 8px; line-height: 1.4; }
.advice-perfect-for-you li svg { width: 20px; height: 20px; margin-right: 10px; fill: #28a745; flex-shrink: 0; }
.advice-product-actions a { display: inline-block; width: 100%; padding: 15px; font-size: 1.1em; font-weight: bold; color: #fff; background-color: #0073b5; border: 0; border-radius: 5px; text-align: center; text-decoration: none; transition: background-color 0.3s; }
.advice-product-actions a:hover { background-color: #005a9e; }
@media (min-width: 768px) { .advice-product-card { flex-direction: row; } }
@media (max-width: 767px) { .advice-product-details h3, .advice-product-details h3 a { font-size: 18px; margin-top: 0; } .advice-product-price { font-size: 22px; } .nas-izbor .content-wrapper { align-items: left; flex-direction: column; align-items: flex-start; gap: 10px; } }

.product-label {
    display: inline-block;
    padding: 12px 12px;
    margin-left: 0px;
    margin-top: 10px;
    font-size: 11px;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    line-height: 1;
    border-radius: 20px;
    vertical-align: middle;
    position: absolute;
    z-index: 5;
}

.benefitsBox { width:100%;overflow:hidden;border-bottom:1px solid #ddd;padding:17px 0 5px; }
.benefitsBox ul { list-style:none;overflow:hidden;margin:0 -20px 0 0;padding:0 0 10px; }
.benefitsBox li { width:20%;float:left;position:relative;padding:0 20px 0 0; }
.benefitsBox li a { display:block;font-size: 14px;color:#333;text-decoration:none;padding:0 0 0 50px; }
.benefitsBox strong { font-weight:700;color:#333;display:block; }
.benefitsBox p { color:#727272;display:block;margin-bottom:0; }
.benefitsBox li:before { width:32px;height:38px;display:inline-block;position:absolute;left:0;top:0;content:''; }
.benefitsBox li.icon1:before { width: 36px; margin-top: 7px; background: url(/game_computer_store/img/svg/truck.svg) left top no-repeat; background-size: 100%; }
.benefitsBox li.icon2:before { background: url(/game_computer_store/img/svg/clock.svg) left top no-repeat; background-size: 100%; }
.benefitsBox li.icon3:before { background: url(/game_computer_store/img/svg/package.svg) left top no-repeat; background-size: 100%; }
.benefitsBox li.icon4:before { background: url(/game_computer_store/img/svg/thuiswinkel-icon.svg) left top no-repeat; background-size: 100%; }
.benefitsBox li.icon5:before { background: url(/game_computer_store/img/svg/data.svg) left top no-repeat; background-size: 100%; }
.benefitsBox li.icon6:before { background: url(/game_computer_store/img/svg/shopping/gamers.svg) left top no-repeat; background-size: 100%; }
.benefitsBox li.icon7:before { background: url(/game_computer_store/img/svg/smiling-face.svg) left top no-repeat; background-size: 100%; }
.benefits-sidebar { width:100%;overflow:hidden;border:1px solid #ddd;margin:19px 0;padding:0; }
.benefits-sidebar ul { list-style:none;overflow:hidden;margin:0 -20px 0 0;padding:0 0 10px; }
.benefits-sidebar li { width:20%;float:left;position:relative;padding:0 20px 0 0; }
.benefits-sidebar li a { display:block;font-size: 14px;color:#333;text-decoration:none;padding:0 0 0 50px; }
.benefits-sidebar strong { font-weight:700;color:#333;display:block; }
.benefits-sidebar p { color: #727272; display: block; margin-bottom: 0px; }
.benefits-sidebar ul { padding-bottom: 0px; padding: 0; }
.benefits-sidebar li { padding: 11px 21px; width: 100%; border-bottom: 1px solid #ddd; }
.benefits-sidebar li:before { width: 32px; height: 38px; display: inline-block; position: absolute; left: 0px; top: 0px; content: ''; }
.benefits-sidebar li:last-child { border-bottom: none; }
.benefits-sidebar li:hover { background: #fbfbfb; }
.benefits-sidebar h3 { font-size:22px;color:#333;font-weight:700;margin:0;padding:12px 0 10px 20px; }
.benefits-sidebar li:before { left: 20px; top: 13px; }
.benefits-sidebar li.icon1:before { width: 36px; margin-top: 7px; background: url(/game_computer_store/img/svg/1-medal.svg) left top no-repeat; background-size: 100%; }
.benefits-sidebar li.icon2:before { background: url(/game_computer_store/img/svg/2-geld.svg) left top no-repeat; background-size: 100%; }
.benefits-sidebar li.icon3:before { background: url(/game_computer_store/img/svg/3-voorraad.svg) left top no-repeat; background-size: 100%; }
.benefits-sidebar li.icon4:before { background: url(/game_computer_store/img/svg/4-wij-bouwen.svg) left top no-repeat; background-size: 100%; }
.benefits-sidebar li.icon5:before { background: url(/game_computer_store/img/svg/5-thumb-up.svg) left top no-repeat; background-size: 100%; }
.benefits-sidebar .thuiswinkel { padding: 0px; }
@media only screen and (max-width: 1024px) {
    .benefitsBox { padding: 10px 0px 0px 0px; }
    .benefitsBox li { width: 33.3%; margin-bottom: 10px; }
}
@media only screen and (max-width: 1159px) {
    .benefitsBox li { padding:0; }
    .benefitsBox li a { padding-left:41px;font-size: 14px; }
    .benefitsBox li:last-child a { padding-left:45px; }
}
.profile .benefitsBox { margin-bottom: 30px; }

.mobile-header-propositions__animated {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  overflow: hidden;
}
.mobile-header-propositions__animated li {
  flex: 1;
  text-align: center;
  width: 100%;
  opacity: 0;
  position: absolute;
  left: 0;
}
.mobile-header-propositions__animated li.active {
  opacity: 1;
  position: relative;
}
.mobile-usp {
  height: 30px;
  position: relative;
  margin-top: -25px;
}

.homepage-usp { margin-top: 44px!important; }

.mobile-usp.top-min {
    margin-top: 20px;
}

.mobile-usp::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}
.mobile-usp ul {
  position: relative;
  display: flex;
  height: 100%;
  background: #fff;
  justify-content: center; 
}
.mobile-usp ul li {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  font-size: 14px;
  background: #fff;
  transition: all ease-in-out 300ms;
  color: #111;
}
.mobile-usp ul li img {
  height: 20px;
  width: 20px;
  margin-right: 10px;
  justify-content: center;
}

.mobile-usp .osmijeh img { width: 110px!important; justify-content: center; }

.mobile-usp ul li.config {
    background-image: url(/game_computer_store/img/svg/konfiguracija.svg);
    background-position: left;
    background-repeat: no-repeat;
}
.mobile-usp ul li.hardware {
    background-image: url(/game_computer_store/img/svg/hardware.svg);
    background-position: left;
    background-repeat: no-repeat;
}
.mobile-usp ul li.garancija {
    background-image: url(/game_computer_store/img/svg/garancija.svg);
    background-position: left;
    background-repeat: no-repeat;
}

.mobile-usp .icon--color-green {
    color: #00b900;
}

.mobile-usp .icon {
    fill: #00b900;
    display: inline-block;
    height: 14px!important;
    vertical-align: middle;
    width: 14px!important;
    font-size: 16px;
}

.mobile-usp .icon-with-text__icon {
    flex-shrink: 0;
    margin-right: 10px;
}

.mobile-usp .color--highlight {
    color: #f60!important;
}

.color--highlight {
    color: #f60!important;
}

.color--highlight-green {
    color: #00b900!important;
}

body.mobile-search-active {
    overflow: hidden; /* Prevent scrolling of the page behind the overlay */
}

.mobile-search-overlay {
    position: fixed;
    top: 0;
    left: 0; /* Set left to 0 */
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    z-index: 10010;
    display: flex; /* Keep as flex for internal layout */
    flex-direction: column;
    font-family: "DM Sans", sans-serif;
    transform: translateX(100%);
    visibility: hidden;
    transition: transform 0.35s cubic-bezier(0.25, 0.1, 0.25, 1), visibility 0s linear 0.35s;
}

.mobile-search-overlay.is-active {
    transform: translateX(0%); /* Slide into view */
    visibility: visible;
    transition: transform 0.35s cubic-bezier(0.25, 0.1, 0.25, 1), visibility 0s linear 0s;
}

.mobile-search-header {
    display: flex;
    align-items: center;
    padding: 8px 10px;
    background-color: #285dab; /* Your site's primary blue header color */
    color: white;
    flex-shrink: 0; /* Prevent header from shrinking */
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    max-height: 44px;
    box-sizing: border-box;
}

.mobile-search-header .back-button {
    background: none;
    border: none;
    padding: 8px;
    margin-right: 0px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.mobile-search-header .back-button svg {
    width: 24px;
    height: 24px;
    fill: #111;
}

.mobile-search-header .search-input-wrapper {
    flex-grow: 1;
    display: flex; /* This is important */
    align-items: center;
    margin-top: -8px;
}

.mobile-search-overlay .header form {
    max-width: 12.5rem;
    max-height: 35px;
    margin-top: 0px;
}

.mobile-search-form {
    display: flex;
    align-items: center;
    width: 100%;
    background-color: #fff;
    border-radius: 4px;
    height: 33px;
    padding: 0px;
    box-sizing: border-box;
}

input#mobileSearchInput.mobile-search-input {
    flex-grow: 1;
    height: 100%;
    border: none;
    padding: 0px;
    font-size: 14px;
    outline: none;
    background-color: transparent;
    color: #333;
}
input#mobileSearchInput.mobile-search-input::placeholder {
    color: #888;
    font-weight: 300;
}

.mobile-search-header .clear-button {
    background: none;
    border: none;
    padding: 8px;
    margin-left: 5px;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.mobile-search-header .clear-button svg {
    width: 20px;
    height: 20px;
    fill: #6c757d; /* Grey icon for clear button */
}

.mobile-search-header .cancel-button {
    background: none;
    border: none;
    color: white;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 10px;
    margin-left: 10px;
    cursor: pointer;
    flex-shrink: 0;
    text-transform: capitalize;
}

.mobile-search-results-container {
    flex-grow: 1;
    overflow-y: auto;
    background-color: #fff;
    padding: 0;
}

.initial-search-suggestions {
    padding: 15px;
}

.initial-search-suggestions h4 {
    font-size: 14px;
    color: #555;
    margin-top: 0;
    margin-bottom: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.initial-search-suggestions ul {
    list-style: none;
    padding: 0;
    margin: 0 0 25px 0;
    background-color: #e9eff5;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.initial-search-suggestions ul li a {
    display: block;
    padding: 12px 15px;
    color: #333;
    text-decoration: none;
    font-size: 14px;
    border-bottom: 1px solid #fff;
    transition: background-color 0.2s ease;
}

.initial-search-suggestions ul li:last-child a {
    border-bottom: none;
}

.initial-search-suggestions ul li a:hover {
    background-color: #f8f9fa;
}

.mobile-search-results-container .product-search-results-grid {
    padding: 10px;
}

.mobile-search-results-container .product-grid-item-wrapper {
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 10px !important;
}

.mobile-search-results-container .search-result-item {
    display: flex;
    align-items: flex-start;
    width: 100%;
    padding: 10px; /* Padding inside each item */
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    text-decoration: none;
    /* Removed hover effects as requested */
}

.mobile-search-results-container .search-result-item .sri-image-column {
    flex: 0 0 120px; /* Fixed width for image */
    margin-right: 12px;
}

.mobile-search-results-container .search-result-item .sri-image-link {
    display: block;
}

.mobile-search-results-container .search-result-item .sri-image {
    width: 120px;
    height: 120px;
    object-fit: contain;
    border-radius: 4px;
    background-color: #fff;
    /*border: 1px solid #f0f0f0;*/
    margin-top: -8px;
}

.mobile-search-results-container .search-result-item .sri-details-column {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 60px; /* Align with image height */
}

.mobile-search-results-container .search-result-item .sri-title {
    margin: 0 0 4px 0;
    font-size: 14px;
    font-weight: 900;
    line-height: 21px;
    color: #007bff; /* Your primary link color */
}

.mobile-search-results-container .search-result-item .sri-title a { color: inherit; text-decoration: none; }
.mobile-search-results-container .search-result-item .sri-title a:hover { text-decoration: underline; }
.mobile-search-results-container .search-result-item .sri-meta {
    font-size: 12px; 
    color: #6c757d;
    margin-bottom: 6px;
    line-height: 1.4;
}
.mobile-search-results-container .search-result-item .sri-price {
    font-size: 14px;
    font-weight: 700;
    color: #111;
    margin-top: auto; /* Pushes price to the bottom */
    padding-top: 4px;
    text-transform: uppercase;
}
.mobile-search-results-container .search-result-item .sri-old-price {
    font-size: 14px;
    color: #6c757d;
    text-decoration: line-through;
    margin-left: 8px;
    font-weight: normal;
}
.mobile-search-results-container > p {
    text-align: center;
    padding: 30px 15px;
    font-size: 16px;
    color: #555;
}
.mobile-search-results-container > p.search-error-message { color: red; }

@media only screen and (max-width: 476px) {
    .mobile-search-results-container .search-result-item { padding: 30px; margin: 0px; }
}

.new-home { background-image:url(/game_computer_store/img/philips-televizorshop-ba-the-xtra-masthead-l.jpg)!important; background-size:cover; background-repeat:no-repeat;background-position:center bottom; }
.new-home2 { background-image:url(/game_computer_store/img/home/rtx-5080.webp)!important; background-size:cover; background-repeat:no-repeat; background-position: center left!important; margin-top: 10px; }
.new-home3 { background-image:url(/game_computer_store/img/philips-televizorshop-ba-the-xtra-masthead-l.jpg)!important; background-size:cover; background-repeat:no-repeat;background-position:center bottom; }
.new-soundbar { background-image:url(/game_computer_store/img/soundbar-homepage.jpg)!important; background-size:cover; background-repeat:no-repeat;background-position:center bottom; }
.new-monitori { background-image:url(/game_computer_store/img/monitori.jpg)!important; background-size:cover; background-repeat:no-repeat;background-position:center bottom; }
.margin-image-soundbar { margin-top: 100px; }
.bottom-margin { margin-bottom: 50px!important; }
.amd-gaming-racunar, .intel-gaming-racunar, .intel-gaming-racunar-pro, .amd-gaming-racunar-pro, .budget-gaming-racunar { padding-top: 110px; }
.budget-gaming-racunar { background-image:url(/game_computer_store/img/budgetgamingracunar.webp)!important; background-size:cover; background-repeat:no-repeat; background-position: center left!important; margin-top: -15px; }
.amd-gaming-racunar { background-image:url(/game_computer_store/img/bg/amd-gaming-racunar--bg.jpg)!important; background-size:cover!important; background-repeat:no-repeat; background-position: center left; margin-top: -15px; }
.amd-gaming-racunar-pro { background-image:url(/game_computer_store/img/bg/amd-gamingracunar-pro.jpg)!important; background-size:cover!important; background-repeat:no-repeat; background-position: center left; margin-top: -15px; }
.intel-gaming-racunar { background-image:url(/game_computer_store/img/bg/intel-gaming-racunar-bg.jpg)!important; background-size:cover; background-repeat:no-repeat; background-position: center left!important; margin-top: -15px; }
.intel-gaming-racunar-pro { background-image:url(/game_computer_store/img/bg/intel-gamingracunar-pro.jpg)!important; background-size:cover; background-repeat:no-repeat; background-position: center left!important; margin-top: -15px; }

a#mobileSearchIconTrigger { display:none;  }

@media only screen and (max-width: 476px) {
    a#mobileSearchIconTrigger { margin-top: 0px; margin-left: 340px; position: absolute; display: block!important; }
    .budget-gaming-racunar { background-image:url(/game_computer_store/img/budget-gaming-racunar-mobile.jpg)!important; background-size:cover; background-repeat:no-repeat; background-position: center left!important; margin-top: -15px; }
}

@media only screen and (max-width: 412px) {
    a#mobileSearchIconTrigger { margin-left: 300px; }
}

@media only screen and (max-width: 360px) {
    a#mobileSearchIconTrigger { 
        margin-left: 270px;
        position: absolute;
    }
}

@media only screen and (max-width: 320px) {
    a#mobileSearchIconTrigger { 
        margin-left: 230px;
        position: absolute;
    }
}

.banner-racunari h1 { font-size:36px; line-height:1; font-weight:700; margin-bottom: 0px; }
.banner-racunari h2 { font-weight: 400; font-size: 17px; margin-bottom: 5px; }
.banner-racunari h3 { font-weight:700; font-size:36px; margin-bottom:10px; }
.banner-racunari h4 { font-size: 26px; font-weight:200; margin-bottom:10px; }
.banner-racunari p { font-size:14px; color:#111; line-height: 18px; font-weight: 400; }
.banner-racunari select { -webkit-appearance: none; -moz-appearance: none; appearance: none; font-weight: 800; overflow: hidden; height: 2.875rem; text-align: center; color: #f60; text-overflow: ellipsis; text-transform: uppercase; background-color: transparent; border: 1px solid #f60; font-size: 1rem; padding-right: 2.8125rem; padding-left: 1.25rem; background-image: url(/game_computer_store/img/angle-down.svg); background-position: right; background-repeat: no-repeat; background-size: 2.5rem 1.25rem; }
.banner-racunari select::-ms-expand { display: none; }
.banner-racunari select option { text-align: center; }
.banner-racunari select, .banner .btn { min-width: 15.625rem; }
.banner-racunari .btn-default { color: #fff; border-color:#0090e2; background-color: #0090e2; margin-bottom: 10px; float:left; font-size:14px; }
.banner-racunari .btn-default:hover { color: #fff; border-color: #0090e2; background: none; opacity: 0.9; }
.banner-racunari .btn-default:after { background-image: url(/game_computer_store/img/angle-right-red.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.banner-racunari .btn-inverted { font-weight: 900; border:.0625rem solid #fff;color:#fff;background:transparent;transition:color .25s ease-in-out,border-color .25s ease-in-out,background-color .25s ease-in-out;margin-bottom:10px; margin-left: 10px; font-size:14px;padding:.9375rem 1.875rem;border-radius:25px; }
.banner-racunari .btn-inverted:hover { color:#000;text-decoration:none;border-color:#000;background-color:transparent; }
.banner-racunari .trustedshops { float: left; margin-left: 20px; }
.banner-racunari .trustedshops img { width: 125px; float: right; clear: both; }
.banner-racunari .row { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.banner-racunari .banner__btn { display: -webkit-flex; display: -ms-flexbox; display: flex; max-width: 540px; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; width: 100%; float: left; clear: both; display: contents!important; margin-top: 10px; padding-top: 10px; margin-bottom: 10px; }
.banner-racunari .banner__btn .btn-blackbutton { background-color:#00000!important;color:#fff!important;border-color:#00000!important; }
.banner-racunari .banner__btn span { display:block;font-weight: 500;font-style:italic;color:#ececec;padding-right:.9375rem;padding-left:.9375rem;font-size: 14px; }
.banner-racunari .banner__available { display: -webkit-flex; display: -ms-flexbox; display: flex; font-weight: 500; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: #ececec; margin-bottom: 1.5625rem; float:left; }
.banner-racunari .banner__available p { font-size:1rem;color:#111;margin:0; }
.banner-racunari .banner__available img { margin-right:10px;margin-bottom:0;margin-top:2px; }
.banner-racunari .checks { clear:both;padding-top:5px; }
.banner-racunari .checks ul { float:left; }
.banner-racunari .checks li { float:left;margin-right:15px; font-size: 14px; }
.banner-racunari .checks img { width:18px;height:18px;float:left;margin:2px 8px 0 0; }

.gradient-bg { 
  position: relative; 
  background: linear-gradient(-60deg, 
    rgba(0, 0, 0, 1), 
    rgba(30, 0, 0, 0.9), 
    rgba(100, 0, 0, 0.8), 
    rgba(150, 0, 0, 0.7), 
    rgba(100, 0, 0, 0.8), 
    rgba(30, 0, 0, 0.9), 
    rgba(0, 0, 0, 1)
  ); 
  background-size: 300% 300%; 
  animation: gradient 15s ease infinite; 
}

.banner {
  position: relative;
  overflow: hidden;
  height: 516px;
  max-height: 516px;
  background-color: #285dab;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center bottom;
  margin-bottom: 0px;
}

.banner p { line-height:21px;font-size: 14px;color:#fff; }
.banner h1 { font-weight:700;margin-bottom:.4375rem;font-size:45px; color:#fff; }
.banner h2 { line-height: 26px; font-weight: 400; font-size: 17px; margin-bottom: 5px; color:#fff; }

.banner .new-home-content,
.banner .new-home2-content {
  padding-top: 110px;
}

.new-home-content-below { padding-top: 140px!important; }
.bottom-margin-home { margin-bottom: 20px; }
.banner .new-home-content h3,
.banner .new-home2-content h3,
.banner .new-home-content h1,
.banner .new-home2-content h1,
.new-home-content-below h1, 
.new-home-content-below h3,
.new-soundbar h3 { line-height:1;font-weight:700;font-size:36px;margin-bottom:10px; color:#fff; }
.banner-racunari { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center bottom; margin-bottom: 0px; }
.banner .image { margin-top: 0px; }

@media only screen and (max-width: 476px) {
    .new-home-content-below { padding-top: 0px!important; }
}

.banner-slides-wrapper { display: flex; width: 100%; height: 100%; transition: transform 0.5s ease-in-out; transform: translateZ(0); }
.banner-slide { flex: 0 0 100%; position: relative; height: 100%; display: flex; align-items: center; }
.banner-background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; opacity: 1.0; background-size: cover; background-position: center; background-repeat: no-repeat; }
.banner-video { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; z-index: -1; }
.banner::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0); z-index: -1; }
.banner .container.extra-top { position: relative; z-index: 1; width: 100%; height: 100%; display: flex; align-items: center; padding-top: 0; padding-bottom: 0; }
.banner .col-md-6 { height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 0px; padding-bottom: 20px; }
.banner .container, .banner .banner__btn, .banner .checks { position: relative; z-index: 1; }

.banner-fallback {
  background-color: #285dab;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -3;
}

.banner-arrow {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%) translateZ(0); /* ADD translateZ(0) for hardware acceleration */
  width: auto;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 24px;
  transition: 0.3s ease;
  user-select: none;
  z-index: 99;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  opacity: 1;
  will-change: transform, opacity;
}

.banner-arrow--prev { left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.banner-arrow--next { right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.banner-arrow:hover { background-color: rgba(0, 0, 0, 0.6); }

.slide-indicators {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%) translateZ(0);
  display: flex;
  gap: 10px;
  z-index: 2;
  width: 90%;
  max-width: 300px;
  will-change: transform, opacity; /* Hint to browser */
}

.indicator {
  flex-grow: 1;
  height: 4px;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 2px;
  overflow: hidden;
  will-change: background-color;
}

.indicator.active { background-color: #fff; }

.indicator::before { content: ''; display: block; height: 100%; background-color: #f60; width: 0; transition: width 0s linear; will-change: width; }
.indicator.active::before { transition: width 0s linear; animation: loading-bar 5s linear forwards; }
.indicator:not(.active)::before { width: 0; animation: none; }
@keyframes loading-bar { from { width: 0; } to { width: 100%; } }
@media only screen and (max-width: 476px) {
  .banner { height: auto; min-height: 400px; max-height: none; }
  .banner .banner__btn .right { margin-left: 0px!important; }
  .banner .container.extra-top { min-height: 620px; }
  span.hide-xs { display: none; }
  a.btn.btn-inverted.popup-content.waves-effect.right.hide-xs { display: none; }
  .banner p { margin-bottom: 0px; }
  .banner-slide { padding-top: 20px; padding-bottom: 20px; }
  .banner-fallback { background-image: url('/game_computer_store/video/mobile-fallback-video.jpg'); }
  .banner h1 { font-size: 30px!important; }
  .banner .banner__available { margin-bottom: 0; }
  .banner select, .banner .btn { width: 100%; }
  .banner img { margin-bottom: 0; margin-top: 10px; }
  .banner h2 { font-size: 21px!important; }
  .banner .banner__btn .left, .banner .banner__btn .right { float: none; margin-left: 0; margin-right: 0; width: 100%; text-align: center; display: block; }
  .banner .banner__btn .left { margin-bottom: 10px; }
  .banner .hidexs { display: none!important; }
  .banner .hidexl { display: block; }
  .banner-arrow { font-size: 18px; padding: 10px; }
}

@media only screen and (max-width: 1024px) {
  .banner img { margin-bottom:0;margin-top:20px; }
  .banner p { line-height:21px; }
  .banner .banner__available { margin-bottom:0; }
}

@media only screen and (min-width: 1024px) {
  .banner .hidexs { display: none!important; }
  .banner .hidexl { display: block; }
}

@media only screen and (max-width: 1199px) {
  .banner h1 { font-size:3.375rem; }
  .banner h2 { font-size:2.75rem; }
  .banner select,.banner .btn{min-width:13.75rem; }
}

@media only screen and (max-width: 320px) {
    .banner h1 { font-size:20px!important; }
    .banner h2 { font-size: 17px !important; line-height: 20px; font-weight: bold; }
    .banner .banner__btn .left { margin-bottom: 0px; }
}

@media only screen and (max-width: 390px) {
    .banner h2 { font-size: 16px !important; line-height: 21px; }
}

.banner select { -webkit-appearance: none; -moz-appearance: none; appearance: none; font-weight: 800; overflow: hidden; height: 2.875rem; text-align: center; color: #f60; text-overflow: ellipsis; text-transform: uppercase; background-color: transparent; border: 1px solid #f60; font-size: 1rem; padding-right: 2.8125rem; padding-left: 1.25rem; background-image: url(/game_computer_store/img/angle-down.svg); background-position: right; background-repeat: no-repeat; background-size: 2.5rem 1.25rem; }
.banner select::-ms-expand { display: none; }
.banner select option { text-align: center; }
.banner select, .banner .btn { min-width: 15.625rem; }
.banner .btn-default { font-size: 14px; color: #fff; border-color: #0090e2; background-color: #0090e2; margin-bottom: 10px; float:left; margin-right: 10px; }
.banner .btn-default:hover { color: #fff; border-color: #fff; background: none; }
.banner .btn-inverted { font-size: 14px; border: 1px solid #fff; color: #fff; background: rgba(255, 255, 255, 0.1); transition: color .25s ease-in-out, border-color .25s ease-in-out, background-color .25s ease-in-out; margin-bottom: 10px; padding: .9375rem 1.875rem; border-radius: 5px; }
.banner .btn-inverted:hover { color:#fff;text-decoration:none;border-color:#f60;background-color:transparent; }
.banner .trustedshops { float: left; margin-left: 20px; }
.banner .trustedshops img { width: 125px; float: right; clear: both; }
.banner .row {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
}

.banner .banner__btn {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  max-width: 540px;
  align-items: center;
  width: 100%;
  margin-top: 10px;
  padding-top: 10px;
  margin-bottom: 10px;
}
.banner .banner__btn .btn-blackbutton { background-color:#00000!important;color:#fff!important;border-color:#00000!important; }
.banner .banner__btn span { display:block;font-weight: 500;font-style:italic;color:#ececec;padding-right:.9375rem;padding-left:.9375rem;font-size: 14px; }
.banner .banner__btn .right { font-size: 14px; margin-left: 10px; }
.banner .banner__available { display: -webkit-flex; display: -ms-flexbox; display: flex; font-weight: 500; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: #ececec; margin-bottom: 1.5625rem; float:left; }
.banner .banner__available p { font-size:1rem;color:#111;margin:0; }
.banner .banner__available img { margin-right:10px;margin-bottom:0;margin-top:2px; }
.banner .checks { clear:both;padding-top:5px; }
.banner .checks ul { float:left; }
.banner .checks li { float:left;margin-right:15px; font-size: 14px; color:#fff; }
.banner .checks img { width:18px;height:18px;float:left;margin:2px 8px 0 0; }

@media (max-width: 390px) {
    .banner .checks li { font-size: 13px; }
}

#discountCode { cursor: pointer; color: #fff; text-decoration: underline; }
#discountCode:hover { color: #fff; }
/* Stil za popup */
.popup {
    visibility: hidden;
    min-width: 250px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 10px;
    position: fixed;
    z-index: 1;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.popup.show {
    visibility: visible;
    animation: fadeIn 0.5s, fadeOut 0.5s 2.5s;
}

@keyframes fadeIn {
    from {top: 20px; opacity: 0;} 
    to {top: 30px; opacity: 1;}
}

@keyframes fadeOut {
    from {top: 30px; opacity: 1;} 
    to {top: 20px; opacity: 0;}
}

@media (max-width: 768px) {
    .popup {
        top: 10px;
    }
}

@media (max-width: 768px) {
    .banner-racunari .btn-inverted {
        font-size: 14px;
        padding: .8rem 1.5rem;
        border-radius: 5px;
    }
    .banner-racunari .btn-inverted { margin-left: 0px; }
}

@keyframes gradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.compare-product-head {
    margin: 8px 0px 0px 0px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.compare-product-head .badge-head {
    position: absolute;
    top: -6px !important;
    left: 17px !important;
    background-color: #f60;
    color: white;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 10px;
    line-height: 17px;
    text-align: center;
    font-weight: bold;
}

.badge-head:empty {
    display: none;
}

@media only screen and (max-width: 476px) {
    .compare-product-head {
        position: relative;
        margin-top: -13px;
        margin-left: -310px;
    }
}

@media only screen and (max-width: 390px) {
    .compare-product-head { position: relative; margin-top: -30px; margin-left: -310px; }
}


.akcija { display: block; align-items: center; float: left; width: 100%; }
.akcija p { font-size: 13px; align-items: center; margin: 0; clear: both; float: left; }
.akcija img { max-width: 16px; margin: 0px; }
.akcija span { margin-left: 5px; text-decoration: none!important; border: 1px dotted; border-radius: 5px; padding: 0 5px 0 5px; }
.akcija span:hover { text-decoration: underline!important; }

@media only screen and (max-width: 476px) {
    .trustedshops { display:none; }
    .page-header h1 { margin-top:80px; }
}

@media only screen and (max-width: 767px) {
    .slick-prev.slick-arrow { float: left; clear: both; left: -5px; top: 40%; z-index: 1; margin-left: 10px; }
    .slick-next.slick-arrow { float: right; clear: both; right: -5px; top: 40%; z-index: 1; margin-right: 10px; }
}

.block.text { font-size: 14px; }
.block.text h1 { margin: 0; font-size: 26px; font-weight: 900; color: #285dab; line-height: 1;}
.block.text h2 { margin: 0; font-size: 21px; font-weight: 400; color: #0090e2; font-family: "Roboto Slab", serif; margin-top: 5px; }
.block.text h3 { margin: 0; font-size: 18px; font-weight: 900; color: #0090e2; font-family: "Roboto Slab", serif; margin-top: 5px; margin-bottom: 10px; }
.block.text p { line-height: 21px; font-size: 14px; }
.float-right { float: right!important; }

.partner-logos { width: 100%; overflow: hidden; margin-bottom: 20px; border-bottom: 1px solid #ddd; padding: 40px 0; }
.partner-logos ul { margin-bottom:30px;clear:both;float:left; }
.partner-logos li.last { float:left;margin-right:0; }
.partner-logos li,.home-new li.mid { float:left;margin-right:21px; }
.partner-logos li img { border-radius: 5px; box-shadow: 0px 0px 8px rgba(0, 0, 0); transition: all ease-in-out 300ms; border: 2px solid #000; }
.partner-logos h2 { float:left;font-size:22px;font-weight:700;margin:0;padding:0 0 18px; color:#111; }
.partner-logos h2 span { display:block;line-height:22px;font-weight:400;clear:both;font-size:1.0625rem;color:#111;padding:3px 0 0; }

.border-style--default { overflow: hidden; border: 1px solid #ddd; }
.border-style--default:hover { border: 1px solid #c5c5c5; }

@media only screen and (max-width: 767px) { 
    .border-style--default { margin-bottom: 10px; }
}

li.first.red-led img:hover { opacity: 0.9; box-shadow: 0px 0px 8px rgba(226, 39, 35, 0.8); transition: all ease-in-out 300ms; border: 2px solid rgba(226, 39, 35, 0.8); }
li.mid.green-led img:hover { opacity: 0.9; box-shadow: 0px 0px 8px rgba(28, 255, 47, 0.8); transition: all ease-in-out 300ms; border: 2px solid rgba(28, 255, 47, 0.8); }
li.last.blue-led img:hover { opacity: 0.9; box-shadow: 0px 0px 8px rgba(0, 182, 255, 0.8); transition: all ease-in-out 300ms; border: 2px solid rgba(0, 182, 255, 0.8); }

.home-new { width:100%;max-width:1280px;margin-right:auto;margin-left:auto;padding-left:10px;padding-right:10px;margin-top:0px; }
.home-new ul { margin-bottom:30px;clear:both;float:left; }
.home-new li.last { float:left;margin-right:0; }
.home-new li,.home-new li.mid { float:left;margin-right:21px; }
.home-new li img { border-radius: 5px; box-shadow: 0px 0px 8px rgba(0, 0, 0); transition: all ease-in-out 300ms; border: 2px solid #000; }
.home-new-block { margin-bottom: 30px; }
.home-new-block.grey-border { border: 1px solid #dddddd; border-radius: 5px; }
.home-new-block img { border-radius: 5px; }

.home-new h3 { font-size: 23px; margin: 0; padding: 20px; text-align: center; color: #285dab; }
.home-new h3 span { 
    /*display:block;line-height:22px;font-weight:400;clear:both;font-size: 14px;color:#111;margin:0;padding:3px 0 0; */
    display: block;
    line-height: 22px;
    clear: both;
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    margin-top: 3px;
    
}

@media only screen and (max-width: 767px) { 
    .home-new li img { width:100%;margin-bottom:10px; }
    .home-new li,.home-new li.mid,.home-new li.last { float:left;margin-right:0!important; }
    .home-new-block { margin-bottom: 10px!important; }
}
@media only screen and (max-width: 1199px) {
    .home-new li img { width:100%;margin-bottom:10px; }
    .home-new li { float:left;margin-right:0!important;width:100%; }
    .home-new li.mid,.home-new li.last { float:left;margin-right:0!important; }
}

.myImageBlockSwiper {
    width: 100%;
    padding-bottom: 30px;
    margin-top: 0px;
    margin-bottom: -25px;
}

.myImageBlockSwiper .swiper-slide {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.myImageBlockSwiper .swiper-slide .home-new-block { width: 100%; }

.myImageBlockSwiper .swiper-slide img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 300px;
    object-fit: cover;
    border-radius: 5px;
}

.myImageBlockSwiper .swiper-pagination-bullet { background: #007aff; opacity: 0.4; }
.myImageBlockSwiper .swiper-pagination-bullet-active { opacity: 1; background: #0056b3; }
.myImageBlockSwiper .swiper-button-next,.myImageBlockSwiper .swiper-button-prev { }

@media (min-width: 768px) {
    .myImageBlockSwiper .swiper-slide img { max-height: none; }
    .myImageBlockSwiper .swiper-pagination { }
}

.customerserviceBox { margin-bottom: 100px; }
.customerserviceBox .fieldset { border: 1px solid #ddd; padding: 30px; margin-bottom: 15px; border-radius: 5px; }
.customerserviceBox h1 { font-family: "Roboto Slab", serif; color:#0090e2; font-size:22px; font-weight:700;margin:0; padding:0px 0x 5px 0px; }
.customerserviceBox h2 { display:inline-block;font-size:16px;color:#111;line-height:18px;font-weight:400;padding:0px; }
.customerserviceBox p { font-size: 14px; color:#111; line-height:18px; }

@media only screen and (max-width: 479px) {
    .customerserviceBox { margin-top: 85px; } 
}

.latest-from-blog {
    text-align: center;
    padding: 40px 0;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
    transition: 0.3s ease-in-out;
    background: #f2f7fc;
    padding-top: 8px;
}

.blog-content { 
    width: 100%;
    max-width: 1280px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 30px;
    padding-left: 15px;
    padding-right: 15px;
}

.latest-from-blog h2 {
    font-size: 26px;
    margin-top: 20px;
    color: #285dab;
    font-weight: 700;
    margin-bottom: 0px;
}

.latest-from-blog p {
    display: block;
    line-height: 12px;
    clear: both;
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "DM Sans", sans-serif;
    margin-top: 5px;
    padding: 0px;
    margin-bottom: 30px;
}

.blog-posts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.blog-post-item {
    background-color: #ffffff;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
}

.blog-post-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
}

.blog-post-item img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.blog-post-content {
    padding: 25px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.blog-post-content h3 {
    font-size: 1.25rem;
    margin: 0 0 15px 0;
    color: #1a2a4d;
    font-weight: 600;
}

.blog-post-content p {
    font-family: "DM Sans", sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: #111;
    margin-bottom: 20px;
    flex-grow: 1;
}

.blog-post-content a {
    display: inline-block;
    text-decoration: none;
    color: #007bff;
    font-weight: 600;
    transition: color 0.3s ease;
}

.blog-post-content a:hover {
    color: #0056b3;
}

.seo-section-wrapper {
    padding: 60px 0;
    background-color: #ffffff;
}

.seo-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 60px;
    gap: 40px;
}

.seo-block:last-child {
    margin-bottom: 0;
}

.seo-block.reverse {
    flex-direction: row-reverse;
}

.seo-image {
    flex-basis: 45%;
}

.seo-image img {
    width: 100%;
    border-radius: 5px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.no-box-shadow { box-shadow: none !important; }

.seo-text {
    flex-basis: 50%;
}

.seo-text h2 {
    font-size: 30px;
    font-weight: 700;
    color: #285dab;
    margin-bottom: 10px;
}

.seo-text p {
    font-family: "DM Sans", sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: #111;
    margin-bottom: 14px;
}

@media (max-width: 992px) {
    .blog-posts {
        grid-template-columns: repeat(2, 1fr);
    }
    .seo-block, .seo-block.reverse {
        flex-direction: column;
        text-align: center;
    }
    .seo-image, .seo-text {
        flex-basis: 100%;
    }
    .seo-text {
        max-width: 600px;
        margin: 0 auto;
    }
    .seo-text h2 {
         font-size: 2rem;
    }
}

@media (max-width: 768px) {
    .blog-posts {
        grid-template-columns: 1fr;
    }
    .latest-from-blog h2 {
        font-size: 2rem;
    }
    .seo-text h2 {
        font-size: 1.8rem;
    }
}

.promo-banner {
  background-color: #ffffff;
  color: #333;
  border-left: 5px solid #f60;
  border-radius: 5px;
  padding: 20px 25px;
  font-family: "DM Sans", sans-serif;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  margin-bottom: 10px;
}

.promo-banner h4 {
  margin-top: 0;
  font-size: 22px;
  font-weight: 600;
  color: #e60000;
  margin-bottom: 0px!important;
}

.promo-banner p {
  font-size: 15px;
  line-height: 1.6;
  margin: 5px 0px 5px 0px;;
}

.reviewBox { width:100%;overflow:hidden;background:#fbfbfb;padding:40px 0; }
.reviewBox h2 { font-size:22px;font-weight:700;margin:0;padding:0 0 18px;color:#111; }
.reviewBox h2 span { display:inline-block;font-size: 14px;color:#111;line-height:22px;font-weight:400;padding:0 0 0 22px; }
.reviewBox .blok { margin-right:13px;width:calc(33.3%-13px);float:left;background:#fff;position:relative;padding:24px 22px 35px; }
.reviewBox h4 { font-size:16px;font-weight:700;margin:0;color:#111; }
.reviewBox h4 a { color:#111;text-decoration:none; }
.reviewBox h4.title { padding-bottom:18px;background:url(/game_computer_store/img/arrow.png) right top no-repeat; }
.reviewBox strong { font-size: 14px;display:block;margin-top:40px;border-top:1px solid #f2f2f2;padding:18px 0 7px; }
.reviewBox ul { list-style-type:none;margin:0;padding:0; }
.reviewBox a { color:#111; }
.reviewBox p { font-size: 14px;color:#111;line-height:21px; }
.reviewBox h4 a:hover,.reviewBox a:hover { color:#e10817;text-decoration:none; }
.reviewBox p a,.reviewBox2 p a { color:#333;text-decoration:underline; }
.reviewBox p a:hover,.reviewBox2 p a:hover { text-decoration:none; }
.reviewBox .quit { width:27px;height:19px;display:block;position:absolute;right:24px;top:27px; }
.reviewBox p span { color:#29cb85; }
.reviewBox .btn .icon { float:left;color:#111;margin:5px 0 0; }
.reviewBox .review-date { float:right;display:block;margin-top:10px; }
.reviewBox2 { width:100%;overflow:hidden;margin-bottom:20px;border-bottom:1px solid #ddd;border-top:1px solid #ddd;padding:40px 0; }
.reviewBox2 .blok {	margin-right: 14px;	width: calc(33.3% - 14px);float: left;position: relative;padding: 22px;	border: 1px solid #ddd; border-radius: 5px; transition: all ease-in-out 300ms; }
.reviewBox2 .blok:hover { background:#fff;transition: all ease-in-out 300ms; border: 1px solid #ddd; }
.reviewBox2 h2 { float:left;font-size:22px;font-weight:700;margin:0;padding:0 0 18px; color:#111; }
.reviewBox2 h2 span { display:block;line-height:22px;font-weight:400;clear:both;font-size:1.0625rem;color:#111;padding:3px 0 0; }
.reviewBox2 h3 { font-weight:400;float:left;font-size:16px;color:#c4c4c4;margin:0;padding:0 0 18px; }
.reviewBox2 h4 { font-size:20px;color:#111;font-weight:700;padding-top:2px;margin:0; }
.reviewBox2 h4 a { color:#111;text-decoration:none;font-size:16px; }
.reviewBox2 h4 a:hover,.reviewBox a:hover { color:#111;text-decoration:none; }
.reviewBox2 h4.title { padding-bottom:18px; }
.reviewBox2 strong { font-size:14px;color:#111;display:block;margin-top:10px;padding:0 0 7px; }
.reviewBox2 ul { list-style-type:none;float:left;clear:both;margin:0;padding:0; }
.reviewBox2 li { float:left; }
.reviewBox2 a { color:#111;font-size: 14px; }
.reviewBox2 p { font-size: 14px;color:#111;line-height:25px;margin-top:5px; }
.reviewBox2.reviews,.reviewBox2 .reviews { float:left;clear:both;margin-top:10px; }
.reviewBox2 .quit { width:27px;height:19px;display:block;position:absolute;right:24px;top:27px; }
.reviewBox2 p span { color:#111; }
.reviewBox2 .btn .icon { float:left;color:#111;margin:5px 0 0; }
.reviewBox2 .review-date { float:right;display:block;margin-top:-2px; }
.reviewBox2 .trusted { float:right; }
@media only screen and (max-width: 767px) {
    .reviewBox2 .blok { width: 100%; }
    .reviewBox2 .trusted { margin-bottom:10px; float: right; width: 23%; }
}

.blogHome { width:100%;overflow:hidden;border-bottom:1px solid #ddd; padding:10px 0px 50px 0px; }
.blogHome .blok { margin-right: 14px; width: calc(33.3% - 14px); min-height: 240px; float: left;position: relative;padding: 22px; border: 1px solid #ddd; border-radius: 5px; transition: all ease-in-out 300ms; }
.blogHome .blok:hover { background:#0e0e0e;transition: all ease-in-out 300ms; opacity: 0.8; border: 1px solid #4e4e4e; }
.blogHome h2 { float:left;font-size:22px;font-weight:700;margin:0;padding:0 0 18px; color:#111; }
.blogHome h2 span { display:block;line-height:22px;font-weight:400;clear:both;font-size:1.0625rem;color:#111;padding:3px 0 0; }
.blogHome h3 { font-weight:700; float:left; font-size:16px; color:#111; margin:0; padding: 15px 0px 5px 0px; }
.blogHome h4 { font-size:20px;color:#111;font-weight:700;padding-top:2px;margin:0; }
.blogHome h4 a { color:#111;text-decoration:none;font-size:16px; }
.blogHome h4 a:hover,.blogHome a:hover { color:#111;text-decoration:none; }
.blogHome h4.title { padding-bottom:18px; }
.blogHome strong { font-size:14px;color:#111;display:block;margin-top:10px;padding:0 0 7px; }
.blogHome ul { list-style-type:none;float:left;clear:both;margin:0;padding:0; }
.blogHome li { float:left; }
.blogHome a { color:#111;font-size: 14px; }
.blogHome p { font-size: 14px;color:#111;line-height:25px;margin-top:5px; float: left; clear: both; }
.blogHome p.time{ font-size:12px; color:#a1a1a1; line-height:21px; margin-bottom:0px; padding-bottom: 0px; }
.blogHome img { border-radius: 5px; transition: all ease-in-out 300ms; }
.blogHome img:hover { border-radius: 5px; transition: 0.3s ease-in-out; opacity: 0.8; }
.blogHome.blog,.blogHome .blog { float:left;clear:both;margin-top:10px; }
.blogHome .quit { width:27px;height:19px;display:block;position:absolute;right:24px;top:27px; }
.blogHome p span { color:#111; }
.blogHome .btn .icon { float:left;color:#fff;margin:5px 0 0; }
.blogHome .review-date { float:right;display:block;margin-top:-2px; }
.blogHome .trusted { float:right; }
@media only screen and (max-width: 767px) {
    .blogHome .blok { width: 100%; }
    .blogHome .trusted { margin-bottom:10px; float: right; width: 23%; }
}

.checkout .footer .footer__main { display: none; }
.footer .footer__main { padding-top:2.375rem;padding-bottom:1.4375rem;background:#0090e2; margin-top: 30px; }
.footer .socialmedia img { max-width:25px; }
.footer .footer__main p { color: #fff; margin-bottom: 1.25rem; }
.footer .footer__main h4 { font-weight: 800; font-size: 1rem; color:#fff; }
.footer .footer__main ul { margin-bottom: 15px; }
.footer .footer__main ul li { line-height: 1.65; }
.footer .footer__main ul li a { color: #fff; }
.footer .footer__main ul li a:hover { color: #fff; }
.footer .footer__main form { position: relative; margin-bottom: 1.875rem; padding-right: 11.4375rem; }
.footer .footer__main form input[type="text"] { border: 0; width: 100%; height: 2.875rem; background: #262626; padding: 0.3125rem 18px; font-size: 0.75rem; }
.footer .footer__main form input[type="text"]::-webkit-input-placeholder,.footer .footer__main form input[type="text"]::-moz-placeholder,.footer .footer__main form input[type="text"]:-ms-input-placeholder,.footer .footer__main form input[type="text"]::placeholder { color:#fff; }
.footer .footer__main form button { padding: 0.625rem 2.1875rem; position: absolute; top: 0; border-radius: 5px; float: right; margin-left: 53%; background-color: #111; color:#fff; border: none; }
.footer .footer__main form .form-control-feedback { display: none; }
.footer .footer__main ol { margin: 0.9375rem -0.125rem; }
.footer .footer__main ol li { display: inline-block; vertical-align: middle; padding-right: 0.125rem; padding-left: 0.125rem; }
.footer .footer__info { background: #0090e2; padding-top: 20px; padding-bottom: 20px; border: 1px solid #009ffa; }
.footer .footer__info>div { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
.footer .footer__info>div:before, .footer .footer__copyright>div:after { display: none; }
.footer .footer__info p { color:#fff;font-size:12px;margin:0; }
.footer .footer__info a { color:#fff; text-decoration: underline; font-size:12px;margin:0; }

@media only screen and (max-width: 479px) {
    .footer .footer__info { text-align: center; }
}

.payments-footer img { float: left; } 
.footer .footer__copyright { background: #0090e2; padding-top: 2.1875rem; padding-bottom: 2.1875rem; }
.footer .footer__copyright>div { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
.footer .footer__copyright>div:before, .footer .footer__copyright>div:after { display: none; }
.footer .footer__copyright ol { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin: 0 -0.625rem; }
.footer .footer__copyright ol li { padding-right: 0.625rem; padding-left: 0.625rem; }
.footer .footer__copyright ul { margin-bottom: 0.25rem; }
.footer .footer__copyright ul li { display: inline-block; position: relative; padding-right: 0.4375rem; padding-left: 0.4375rem; }
.footer .footer__copyright ul li:first-child { padding-left:0; }
.footer .footer__copyright ul li:first-child:before { display:none; }
.footer .footer__copyright ul li:last-child { padding-right:0; }
.footer .footer__copyright ul li a { font-size: 13px;color:#fff; }
.footer .footer__copyright ul li a:hover { color: #fff; text-decoration:underline; }
.footer .footer__copyright aside { padding-left:1.25rem; }
.footer .footer__copyright p { color:#fff;font-size: 13px;margin:0; }
.footer__copyright .logo { float:left;display:block;background-position:center;background-repeat:no-repeat;background-size:100%;margin:-9px 0 0; }
.footer__copyright .logo ul { float:left; list-style:none; }
.footer__copyright .logo li { float:left; list-style:none; }
.footer__copyright .logo img { float:left; }

@media only screen and (max-width: 479px) {
    .footer__copyright .logo  { display: none; }
}
@media only screen and (max-width: 767px) {
    .footer .footer__main { text-align: center; }
    .footer .footer__copyright aside { width:100%; padding: 0;     }
    .footer .footer__copyright ol { width: 100%; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
    .footer .footer__copyright { text-align: center; padding-top: 1.25rem; padding-bottom: 1.25rem; }
    .footer .footer__main form button { margin-left: 25%;  }
    form .form-control, form button, form input, form select, form textarea { width: 100%; max-width: 100%; }
}
.copyrightBox { background:#1c1917;width:100%;overflow:hidden;position:relative;padding:22px 0; }
.copyrightBox .left { float:left;margin-right:150px;padding:13px 0 0; }
.copyrightBox .right{ position:absolute;top:0;right:0; }
.copyrightBox .right img { height:50px;width:160px; }
.copyrightBox p { font-size: 14px;color:#bfbfbf;line-height:28px;padding:0 20px 0 0; }
.copyrightBox p a { color:#fff;text-decoration:underline;font-weight:700; }
.copyrightBox p a:hover { text-decoration:none; }
.copyrightBox .share { width:20px;height:20px;display:inline-block;position:relative;top:5px;background:url(/game_computer_store/img/share.png) right center no-repeat; }
.backtop { position: fixed; right: 20px; bottom: 20px; width: 45px; height: 45px; line-height: 46px; display: none; background: #ddd; transition: background .1s linear; border-radius: 100%; }
.backtop span { font-size: 26px; color: #fff; text-align: center; display: block; line-height: 43px; }
.backtop:hover { text-decoration: none; background: #2e2e2e; transition: background .1s linear; color: #ddd; }
.backtop:focus, .backtop:active { border: none; outline: inherit; text-decoration: none; }
@media only screen and (max-width: 479px) {
    .backtop { display: none; }
}
.breadcrumbBox { margin-bottom: 15px; padding-top: 15px; padding-bottom: 12px; background: #fff; border-bottom: 1px solid #f2f7fc; border-top: 1px solid #f2f7fc; }
.breadcrumb { background:transparent;margin:0;padding:0; }
.breadcrumb ol { float:left;padding-top:1px;margin:0; }
.breadcrumb .fb-like { float:right;margin-left:4px; }
.breadcrumb .fb-share-button { float:right; }
.breadcrumb li { list-style:none;display:inline-block;line-height:20px;color:#285dab;margin:0; }
.breadcrumb li img { width: 15px; }
.breadcrumb a { color:#0090e2;font-size: 14px; }
.breadcrumb a:hover { color:#0090e2;text-decoration:underline; }
.breadcrumb>.active { color:#0090e2;font-size: 14px; }
.breadcrumb i { font-size: 14px;color:#ccc;padding:0 10px; }
@media only screen and (max-width: 479px) {
    .breadcrumbBox { display:none!important;padding-top:0; }
    .breadcrumb ol>li { line-height:1.42857143;display:inline-block; }
    .breadcrumb ol>li::before { font-family:FontAwesome; content:"\f105";font-size:22px;padding:0 10px; }
    .breadcrumb i.fa-angle-right,.breadcrumb .mobile-off { display:none; }
}

.navigation-head {
    margin-bottom: 15px !important;
    padding-top: 15px;
    padding-bottom: 12px;
    padding-left: 0;
    margin: 0;
    list-style-position: inside;
    list-style-type: disc;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    height: 36px;
    gap: 5px;
    border-radius: 5px;
    background-color: #f2f7fc;
}

.navigation-head ol:not(.show-all) li:first-child,
.navigation-head ol:not(.show-all) li:nth-child(2),
.navigation-head ol:not(.show-all) li:last-child { display: none !important; }

.navigation-head ol.show-all li,
.navigation-head ol.additional-links li {
    margin-right: 10px;
    border-right: 1px solid #ddd;
    padding-right: 10px;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.navigation-head ol.show-all li:last-child,
.navigation-head ol.additional-links li:last-child {
    border-right: none;
    padding-right: 0;
}

.navigation-head span.back-to-category {
    float: left;
    margin-right: 5px;
    margin-top: -4px;
    margin-left: 10px;
}
.navigation-head span.back-to-category svg {
    width: 10px;
    height: 10px;
    fill: #0090e2;
    display: block;
    margin-top: 3px;
}

.navigation-head ol {
    float:left;
    padding-top:1px;
    margin:0;
    margin-top: -10px;
    list-style:none;
}

.navigation-head .fb-like { float:right; margin-left:4px; }
.navigation-head .fb-share-button { float:right; }

.navigation-head li {
    list-style:none;
    display:inline-block;
    line-height:20px;
    color:#0090e2;
    margin:0;
}
.navigation-head li img { width: 15px; }
.navigation-head a { color:#0090e2!important; font-size: 13px!important; text-decoration: none; }
.navigation-head a:hover { color:#0090e2; text-decoration:underline; }
.navigation-head > .active { color:#0090e2; font-size: 14px; }
.navigation-head i { font-size: 14px; color:#ccc; padding:0 10px; }
li.ljetni-popusti a, li.kombo-ponude a { padding: 5px!important; }
.navigation-head li.ljetni-popusti-akcija {     
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 13px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60!important;
    display: inline-block;
    padding: .2rem .4rem .4rem;
    background: #fef1e8;
    border: none !important;
}

.navigation-head li.ljetni-popusti-akcija a { color:#f60!important; padding: 0px!important; }
.navigation-head li.ljetni-popusti-akcija a:hover { color:#f60!important; text-decoration: none; opacity: 0.8; }
.nav-main-row { display: contents; }

@media only screen and (max-width: 479px) {
    .navigation-head {
        padding: 10px 5px;
        height: auto;
        overflow: visible;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-top: -5px;
        margin-bottom: 0px!important;
        background: #fff!important;
    }
    .navigation-head li {
        padding-top: 9px;
    }
    .navigation-head > * { 
        float: none !important;
        margin-top: 0 !important;
        margin-left: 0;
        margin-right: 0;
    }
    
    .navigation-head ol.additional-links li:first-child {
        padding-left: 10px;
    }

    /* Styling for the new wrapper on mobile */
    .navigation-head .nav-main-row {
        display: flex;
        align-items: center;
        width: 100%;
        gap: 8px;
        background: #fff!important;
    }

    .navigation-head .nav-main-row span.back-to-category {
        margin: 0 0 0 5px;
        flex-shrink: 0;
    }
    .navigation-head .nav-main-row span.back-to-category svg {
        width: 18px; height: 18px; display: block;
    }

    .navigation-head .nav-main-row ol.main-breadcrumbs {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        padding: 5px 0;
        margin: 0;
        flex-grow: 1;
        min-width: 0;
        background-color: #e9eff5;
        border-radius: 4px;
        list-style: none;
    }
    .navigation-head .nav-main-row ol.main-breadcrumbs::-webkit-scrollbar {
        display: none;
    }

    .navigation-head .nav-main-row ol.main-breadcrumbs li {
        display: inline-block;
        white-space: nowrap;
        line-height: 1.5;
        color: #0090e2;
        margin: 0;
        padding: 0;
        border-right: none !important;
    }
    .navigation-head .nav-main-row ol.main-breadcrumbs li:not(:last-child)::after {
        content: ">";
        font-size: 14px;
        color: #555;
        padding: 0 7px;
        vertical-align: middle;
    }
    .navigation-head .nav-main-row ol.main-breadcrumbs li a {
        font-size: 12px;
        padding: 4px 2px;
        display: inline-block;
        color: #0090e2 !important;
    }
    .navigation-head ol.additional-links {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        padding: 5px 0;
        width: 100%;
        box-sizing: border-box;
        list-style: none;
        background-color: #f2f7fc;
        border-radius: 5px;
    }
    .navigation-head ol.additional-links::-webkit-scrollbar { display: none; }

    .navigation-head ol.additional-links li {
        display: inline-block; white-space: nowrap; line-height: 1.5; color: #0090e2;
        margin: 0; padding: 0; border-right: none !important;
    }
    .navigation-head ol.additional-links li:not(:last-child)::after {
        content: ">"; font-size: 14px; color: #555; padding: 0 7px; vertical-align: middle;
    }
    .navigation-head ol.additional-links li a {
        font-size: 14px!important; padding: 4px 2px; display: inline-block; color: #0090e2 !important;
    }
    
    .navigation-head ol>li::before { display: none !important; }
    .navigation-head i.fa-angle-right,

    .navigation-head .fb-like,
    .navigation-head .fb-share-button {
        margin: 0 auto;
        display: block;
    }
}

.energylabel { margin-bottom: 0px; }
.energylabel img { width: 54px; height: 28px; }
.energylabel ul { float: left; }
.energylabel li { float: left; list-style:none!important; }
.energylabel li.last { margin-left: 5px; }
.energylabel li a, .energylabel a { color:#111; }
.energylabel li a:hover, .energylabel a:hover { color:#111; text-decoration: underline; }
.mobile-top, .desktop-top { margin-top: 10px; }
.mobile-bottom, .desktop-bottom { margin-bottom: 30px; margin-top: 0px; }

@media only screen and (max-width: 479px) {
    .mobile-top-70 { margin-top: 44px; }
    .mobile-bottom, .desktop-bottom { margin-bottom: 30px; margin-top: 30px; }
}

.energylabel-home { margin-bottom: 0px; position: absolute; margin-left: 222px; margin-top: 10px; }
.energylabel-home img { width: 54px; height: 28px; }

@media only screen and (max-width: 479px) {
.energylabel-home { margin-bottom: 0px; position: absolute; margin-left: 236px; margin-top: -254px; }
.energylabel-home img { width: 54px; height: 28px; }
}

@media only screen and (max-width: 479px) {
    .mobile-top-70 { margin-top: 44px; }
}

.extra { margin-top: 10px; padding: 20px; border: 1px solid #ddd; border-radius: 5px; }

.lg-extra-garancija {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    margin: 0px;
    font-family: "DM Sans", sans-serif;
    color: #333;
}

.garancija-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.garancija-icon svg {
    width: 40px;
    height: 40px;
    fill: #0090e3;
}

.garancija-content {
    flex-grow: 1;
}


.garancija-icon {
    width: 40px;
}

/* Stil za LG logo */
.garancija-icon img {
    max-height: 40px;
    width: auto;
}

/* Glavni naslov */
.garancija-content h3 {
    margin: 0;
    font-size: 16px;
    color: #333333;
    font-weight: 600;
}

/* Tekst ponude */
.garancija-content p {
    margin: 0;
    font-size: 1em;
    font-weight: 600;
    color: #333;
}
.garancija-logo {
    width: 60px;
}
/* Stil za LG logo */
.garancija-logo img {
    max-height: 25px;
    width: auto;
}

.garancija-napomena {
    font-size: 0.9em;
    color: #555;
    line-height: 1.5;
    padding-top: 15px;
    border-top: 1px solid #ddd;
}

.garancija-napomena p {
    margin: 0;
}
        
/* Stil za listu unutar napomene */
.garancija-napomena ul {
    padding-left: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
    list-style-type: disc;
    color: #444;
    font-size: 0.95em;
}

.garancija-napomena li {
    list-style-type: disc;
    margin-bottom: 8px;
    line-height: 15px;
}

.toggle-label {
    display: flex; 
    align-items: center;
    cursor: pointer;
    gap: 0.75rem; 
    width: 100%;
}

.toggle-text {
    font-size: 1em;
    font-weight: 600;
    color: #333;
    user-select: none;
    flex-grow: 1;
}

.is-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

.warranty-switch { 
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    background-color: #e5e7eb;
    border-radius: 9999px;
    transition: background-color 0.2s ease-in-out;
    flex-shrink: 0;
}

.warranty-switch .warranty-handle {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background-color: white;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
}

.warranty-handle .checkmark-icon {
    width: 12px;
    height: 12px;
    stroke: #285dab;
    stroke-width: 2.5;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

/* Style the switch based on the hidden checkbox's state */
.is-visually-hidden:checked ~ .warranty-switch {
    background-color: #285dab;
}

.is-visually-hidden:checked ~ .warranty-switch .warranty-handle {
    transform: translateX(18px);
}

.is-visually-hidden:checked ~ .warranty-switch .warranty-handle .checkmark-icon {
    stroke: white;
    opacity: 1;
}

/* Stil za link "Više informacija" */
.info-link {
    margin-top: 10px;
    font-size: 0.9em;
}

.lg-info { margin-top: 10px; margin-bottom: 0px; padding-top: 15px; clear: both; float: left; }

.lg-info svg {
    width: 20px;
    height: 20px;
    fill: #3A3A3A;
    margin-left: 4px;
    margin-top: 2px;
    position: absolute;
}

.installation-service-block {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    color: #333;
    margin-bottom: 20px;
}
.installation-service-block fieldset {
    border: none;
    padding: 0;
    margin: 0;
}
.info-link {
    margin-top: 10px;
    font-size: 0.9em;
}
.info-link a {
    color: #0090e3;
    text-decoration: none;
    font-weight: 500;
}
.info-link a:hover {
    text-decoration: underline;
}

.installation-toggle-label {
    display: flex; 
    align-items: center;
    cursor: pointer;
    gap: 0.75rem; 
    width: 100%;
}

.installation-toggle-text {
    font-size: 1em;
    font-weight: 600;
    color: #333;
    user-select: none;
    flex-grow: 1;
}

.is-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

.installation-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    background-color: #e5e7eb;
    border-radius: 9999px;
    transition: background-color 0.2s ease-in-out;
    flex-shrink: 0;
}

.installation-switch .installation-handle {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background-color: white;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
}

.installation-handle .checkmark-icon {
    width: 12px;
    height: 12px;
    stroke: #285dab;
    stroke-width: 2.5;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

/* Stanje kada je uključeno */
.is-visually-hidden:checked ~ .installation-switch {
    background-color: #285dab;
}

.is-visually-hidden:checked ~ .installation-switch .installation-handle {
    transform: translateX(18px);
}

.is-visually-hidden:checked ~ .installation-switch .installation-handle .checkmark-icon {
    stroke: white;
    opacity: 1;
}
  
.dodatne-usluge { margin-top: 20px; margin-bottom: 30px; }     
.dodatne-usluge h4 {
    margin: 0;
    font-size: 18px;
    font-weight: 900;
    color: #285dab;
    text-transform: uppercase;
    margin-top: -14px;
}

.dodatne-usluge h5 {
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    float: left;
    position: absolute;
}
        
.step { text-align:center; }
.step.cart { margin-top:40px; }
.step ul li { overflow:hidden;font-weight:700;padding-bottom:18px;font-size: 14px; }
.step ul li:first-child { text-align:left; }
.step ul li:last-child { text-align:right; }
.step ul li p { display:inline-block;position:relative;padding-top:1.75rem;margin:0; }
.step ul li:first-child span:before,.step ul li:last-child span:after { display:none; }
.step ul li span { display: block; width: 0.9375rem; text-align: left; height: 0.9375rem; border-radius: 50%; color: transparent; text-indent: -999999px; background: #ddd; -webkit-transform: translateX(-50%); transform: translateX(-50%); font-size: 0rem; position: absolute; top: 0; left: 50%; }
.step ul li span:before, .step ul li span:after { content: ''; height: 1px; width: 1000px; display: block; background: #ddd; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; left: 100%; }
.step ul li span:before { left: auto; right: 100%; }
.step ul li strong { text-align: center; display: inline-block; color: #969696; font-size: 14px; }
.step ul li.is-active span { width: 0.9375rem; height: 0.9375rem; border: 4px solid #2ecc71; }
.step ul li.is-active span:after { background: #2ecc71; }
.step ul li.is-active span:before { background: #2ecc71; }
.step ul li.is-active strong { color: #111; }

@media only screen and (max-width: 767px) {
    .step { text-align: left; margin-top: 50px; }
    .step ul li:last-child { text-align: left; }
    .step ul li p { padding-top: 0; padding-left: 1.5625rem;    }
    .step ul li span { -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; left: 0; }
    .step ul li span:before, .step ul li span:after { width: 1px; height: 1000px; -webkit-transform: translateX(-50%); transform: translateX(-50%); position: absolute; top: 100%; left: 50%; }
    .step ul li strong { text-align: left; }
}
.dignity { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;padding-top: 1.5625rem; padding-bottom: 1.5625rem; margin-bottom: 1.25rem; }
.dignity>div { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }
.dignity>div:before, .dignity>div:after { display: none; }
.dignity h1 { font-weight: 800; margin-bottom: 0.125rem; font-size: 1.625rem; color:#111;}
.dignity p { font-weight: 500; margin: 0; color: #111; }
.dignity__tel { position: relative; padding-left: 3.125rem; }
.dignity__tel>a { display: block; width: 2.3125rem; overflow: hidden; height: 2.3125rem; border-radius: 50%; text-indent: -999px; background-color: #0090e2; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; left: 0; background-image: url(/game_computer_store/img/mail-white.svg); background-position: center; background-repeat: no-repeat; background-size: 58% 58%; border: 2px solid #0090e2; transition: all ease-in-out 300ms; }
.dignity__tel>a:hover { border: 2px solid #0090e2; transition: all ease-in-out 300ms; }
.dignity__tel h5 { font-weight: 800; margin: 0; font-size: 14px; }
.dignity__title { width: 70%; }
.dignity__title img { float: left; max-width: 4.75rem; margin-top: -0.625rem; margin-right: 1.25rem; }

.dignity__title h3 {
    margin: 0;
    font-size: 26px;
    font-weight: 900;
    color: #285dab;
    text-transform:uppercase;
    margin-top: -14px;
}

.dignity__title h4 {
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    float: left;
    position: absolute;
}


.checkout-help { }
@media only screen and (max-width: 479px) {
.dignity__title { margin-bottom: -10px !important; margin-top: 30px; }
.dignity__title img {  max-width: 3.125rem;  }
.dignity__title h3 { margin-top: -26px; float: left; }
.dignity__title h4 { margin-bottom: 10px; }
.dignity { margin-bottom: 30px; padding-bottom: 30px; }
.checkout .dignity__title { margin-top: 0px!important; }
}

@media only screen and (max-width: 1024px) {
    .dignity__title img { float:none;margin:0 auto .625rem; }
    .dignity__title { width:100%;margin-bottom:1.25rem; }
    .dignity__tel { display:none; }
    .dignity>div { display:block;text-align:center; }
    .dignity__tel>a { display: block; -webkit-transform: translateY(0); transform: translateY(0); margin-right: auto; margin-bottom: 0.3125rem; margin-left: auto; position: static; }
}

.ordering { padding-bottom: 0.625rem; }
.ordering__head { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 0.75rem; }
.ordering__head .btn { border-radius: 5px; margin-bottom:.9375rem; border-radius: 5px; font-size: 15px; font-weight: 700; box-shadow: inset 0 -2px 0 0 #090; min-height: 45px; }
.ordering__head .btn:after { 
    content: '';
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(-45deg);
    width: 0.5rem;
    height: 0.5rem;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    pointer-events: none;
    display: block;
}

.ordering__time { text-align: left; border-radius: 4px; border: 1px solid #ddd; position: relative; padding: 0.625rem 1.875rem 0.625rem 3.125rem; border-radius: 5px; }
.ordering__time:before { content: ''; height: 100%; display: block; width: 3.3125rem; position: absolute; top: 0; left: 0; background-image: url(/game_computer_store/img/clock-gray.svg); background-position: center; background-repeat: no-repeat; background-size: 1.4375rem 1.4375rem; }
.ordering__title { font-weight:700;border-top:1px solid #ddd;padding-top:18px;padding-bottom:18px;font-size: 14px; }
.ordering__detail { border-top:1px solid #ddd;border-bottom:1px solid #ddd; padding-top:1.3125rem;padding-bottom:1.3125rem;margin-top:-1px; }
.ordering__detail h5 { font-weight: 900;font-size: 14px;margin-bottom:.625rem; }
.ordering__detail label { font-weight:400;margin-bottom:.625rem; }
.ordering__detail strong { background:#fff; padding: 5px; font-size:14px; border: 1px solid #ddd; border-radius: 5px; }
.ordering__detail ul li { line-height:1.6;font-weight: 500;font-size: 14px; }
.ordering__detail .form-control,.ordering__detail input { display:inline-block;width:3.625rem;height:2.6875rem;text-align:center;margin-right:.625rem; }
.ordering__detail .form-control[readonly],.ordering__detail input[readonly]{ background:transparent; }
.ordering__detail .form-control:focus,.ordering__detail input:focus { border-color:#ddd; }
.ordering__detail .form-control+a,.ordering__detail input+a { color:#fff;font-size:1.125rem; }
.ordering__product { position:relative;padding-top:.75rem;padding-right:6.5625rem; }
.ordering__product img { margin-right:auto;margin-bottom:1.25rem;margin-left:auto; margin-top: -10px; }
.ordering__product .item-options { font-size: 14px;color:#848484; }
.ordering__product h5 { color:#0090e2; }
.ordering__product h5 a { color:#0090e2; }
.ordering__align { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.ordering__align:before,.ordering__align:after { display:none; }
.ordering__close { display:inline-block;color:#111;font-size: 14px;position:absolute;top:.625rem;right:0; }
.ordering__close:before { content: ''; width: 0.625rem; height: 0.625rem; display: inline-block; margin-right: 0.625rem; background-image: url(/game_computer_store/img/close-icon-blue.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100% }
.ordering__close:hover { color:#111; text-decoration: underline; }
.ordering__price { margin-top:.625rem;margin-bottom:.625rem; text-transform: uppercase; }
.ordering__price span { text-transform: none!important; color: #00b200; font-weight: 900; }
span.free-promo-product { font-weight: 900; }
.ordering__utility { padding-top:1.5625rem; }
.ordering__utility h5 { font-weight:400;border-bottom:1px solid #ddd;position:relative;font-size: 14px;padding-right:1.5625rem;padding-bottom:.5rem; }
.ordering__utility h5>a { font-size:1rem;position:absolute;top:0;right:0; }
.ordering__utility ul li { display: -webkit-flex; display: -ms-flexbox; display: flex; border-bottom: 1px solid #ddd; margin-bottom: 0.75rem; padding-bottom: 0.75rem; }
.ordering__utility ul li>div { width:60%;text-align:right;padding-right:1.25rem; }
.ordering__utility ul li>div:last-of-type { width:40%;text-align:left;padding-left:1.25rem; }
.ordering__utility ul li>div>a { color:#ff6348; }
.ordering__utility ul li strong { font-weight:400;font-size:18px; }
.ordering__utility ul li:first-child>div span { display:block;font-weight: 500; }
.ordering__input { font-weight: 500;display:inline-block;position:relative;margin-bottom:1.25rem;padding-left:.8125rem; }
.ordering__input:before { content: ''; width: 0.5625rem; height: 0.625rem; position: absolute; top: 0.4375rem; left: 0;  background-image: url(/game_computer_store/img/angle-right-white.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.ordering__input:hover { color: #fff; }
.ordering__align .btn-refresh { height: 40px; line-height: 20px; text-align: center; font-size: 18px; color: #0090e2; border: 0px solid #f2f2f2; border-radius: 0; margin: -2px 0 0 0; padding: 0; display: inline-block; }
.ordering__utility .left { width:338px;float:left;font-family: "DM Sans", sans-serif;font-weight: 500;position:relative; }
.ordering__utility .right { width:278px;float:right; }
.ordering__utility .discount { font-size: 14px;color:#111;border-bottom:1px solid #ddd;padding:22px 0 5px; }
.ordering__utility .code { font-size: 14px;color:#fff;text-decoration:underline;display:inline-block;position:relative;padding:11px 0 0 15px; }
.ordering__utility .code:after { position:absolute;left:3px;top:7px;font-family:FontAwesome;content:"\f105";font-size:20px; }
.ordering__utility .code:hover { text-decoration:underline; }
.ordering__utility .extra { position:relative;margin:5px 0 0; }
.ordering__utility .extra strong { padding-bottom:5px;font-size: 14px;color:#111;display:block;font-weight:400;border-bottom:1px solid #ddd; }
.ordering__utility .extra strong span { float:right;font-size:20px; }
.ordering__utility .extra .info{ position:absolute;right:0;top:40px;font-size:16px;color:#111;display:block; }
.ordering__utility .extra .checkbox label { display:inline-block;cursor:pointer;position:relative;padding-left:25px;margin-right:15px;font-family: "DM Sans", sans-serif;font-weight: 500;font-size: 14px;color:#111; }
.ordering__utility .extra .checkbox input[type=checkbox]{ display:none; }
.ordering__utility .extra .checkbox span { line-height:26px; }
.ordering__utility .extra .checkbox span:before { content:"";display:inline-block;width:18px;height:18px;margin-right:10px;position:absolute;left:0;top:5px;border:1px solid #ddd;padding:3px; }
.ordering__utility .extra .checkbox input[type=checkbox]:checked+span:before { border:none;content:'';background:url(/game_computer_store/img/selected-checkbox.png) left top no-repeat; }
.ordering__utility .total,.ordering__utility .total .ukupno { font-size:17px;color:#111; }
.ordering__utility .total .ordering__head { margin-top: 15px; float: right; }
.ordering__utility .total .col { padding: 0px 44px 0px 0px; width: calc(100% - 118px); float: left; text-align: right; font-size: 14px; }
.ordering__utility .total .col3 { width:118px;float:right;font-weight:700; }
.ordering__utility .total .tax { font-size: 14px;color:#111;display:block;font-weight: 500; }
.ordering__utility .top { overflow:hidden;border-bottom:1px solid #ddd;padding:20px 0 15px; }
.ordering__utility .bottom { overflow:hidden;font-size: 14px;border-bottom:1px solid #ddd;padding:15px 0; }
.ordering__utility .bottom .orange { color:#00b200;font-weight: 900; }
.pogledaj-promijeni{cursor:pointer;text-decoration:none;color:#111; }
.pogledaj-promijeni:hover { cursor:pointer;text-decoration:underline; }
.pogledaj-promijeni i { font-size: 14px;color:#a1a1a1;float:right;margin:2px 0 0 7px; }
.bottom.row li { display:inline-block;padding-right:.1875rem;padding-left:.1875rem;margin:0; }
.col3.ukupno { text-transform: uppercase; }

@media only screen and (max-width: 479px) {
    .ordering__product img { margin-top: 20px; }
    .ordering__utility .total .ordering__head { min-width: 400px; }
}

@media only screen and (max-width: 390px) {
    .ordering__utility .total .ordering__head { min-width: 360px; }
}
@media only screen and (max-width: 767px) {
    .ordering__product { padding-top:.75rem;padding-right:0;padding-bottom:1.25rem; }
    .ordering__align { display:block; }
    .ordering__close{ position:static;margin-bottom:.625rem; }
    .ordering__detail { text-align:center; border: 1px solid #ddd; padding: 10px; border-radius: 5px; }
    .ordering__head { display:block;text-align:center; }
}

@media only screen and (max-width: 320px) {
    .ordering__utility .total .ordering__head { min-width: 290px; }
}

.bottomoptionBox { width:100%;overflow:hidden;font-size: 14px;background:#f7f7f7;margin:40px 0;padding:10px 10px 10px 21px; }
.bottomoptionBox a.back { position:relative;display:inline-block;line-height:47px;float:left;text-decoration:none;padding:0 0 0 20px; }
.bottomoptionBox a.back:after { position:absolute;left:0;top:0;font-family:FontAwesome;content:"\f104";font-size:22px; }
.bottomoptionBox p { width:62%;float:left;position:relative;line-height:47px;text-align:right;margin:0;padding:0 25px 0 0; }
.bottomoptionBox p:after { position:absolute;right:0;top:0;font-family:FontAwesome;content:"\f061";font-size:22px;color:#7b7b7b; }
@media only screen and (max-width: 767px) {
    .bottomoptionBox p { width:auto;text-align:left;float:left; }
    #shoppingCntr .button,.bottomoptionBox .btn-continue,.accessBox .block { width:100%; }
}
@media only screen and (max-width: 1024px) {
    .bottomoptionBox p { width:auto;text-align:left;float:right; }
}
.homeinfoBox { width:100%;overflow:hidden;padding:20px 0; }
.homeinfoBox .holder { margin-right:-13px; }
.homeinfoBox .blok { width:33.3%;float:left;padding:0 13px 0 0; }
.homeinfoBox img { width:100%; }
@media only screen and (max-width: 767px) {
    .homeinfoBox .blok { width: 100%; }
}

.garancija p { width: 100%; }
.garancija a:hover { text-tecoration: underline; }

.extra-garancija { padding: 10px; border: 1px solid #ddd; border-radius: 5px; }
.extra-garancija p { width: 100%; }
.extra-garancija a:hover { text-tecoration: underline; }

.extra-garancija h2 { 
    font-size: 18px;
    font-weight: 900;
    color: #285dab;
    text-transform: uppercase;
    margin: 0px;
}

.extra-garancija h3 {
    margin-bottom: 0px;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
} 

.infoBox { width:100%;overflow:hidden; }
.infoBox .holder { margin-right:-25px; }
.infoBox .block .block { margin-right:25px;width:calc(50%-25px);float:left;border:1px solid #ddd;padding:28px 26px 24px; }
.infoBox h2 { padding-bottom:10px;font-size:22px;color:#fff;font-weight:700;margin:0; }
.infoBox h2 a { font-size:22px;color:#fff; }
.infoBox h2 a:hover { color:#e10817;text-decoration:none; }
.infoBox p { font-size: 14px;color:#fff;line-height:28px; }
.infoBox a { color:#fff;text-decoration:none;font-size: 14px; }
.infoBox a:hover { color:#fff;text-decoration:none; }
.support { border:1px solid #ddd;margin-bottom:1.1875rem; border-radius: 5px; }
.support p { color:#111;margin:0; }
.support .belons { margin:10px 0; }
.support h3 { font-weight:700;font-size:17px;margin-bottom:10px;margin-top:10px; }
.support h4 { font-weight:700;font-size:20px;margin-bottom:1px;margin-top:10px; }
.support img { margin-top:-.9375rem;margin-right:auto;margin-left:auto;max-width:125px; }
.support__tel { color:#ff6348;font-size: 14px; }
.support__wrap { display:flex;padding:0 10px 0 20px; }
.support__left { padding-right:.625rem;padding-bottom:.3125rem; }
.support__man { -webkit-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; }
.profitBox,.profit { border:1px solid #ddd;margin-bottom:1.25rem;color:#111;padding:1rem; border-radius: 5px; }
.profitBox h5,.profit h5 { font-weight:700;font-size:1.125rem;color:#fff; }
.profitBox h4 { text-transform:uppercase;font-weight:700;border-bottom:1px solid #ddd;font-size: 14px;margin-right:-1rem;margin-bottom:0;margin-left:-1rem;color:#fff;padding:15px; color:#111; }
.profitBox ul,.profit ul { margin-right:-1rem;margin-bottom:0;margin-left:-1rem; }
.profitBox ul li,.profit ul li { line-height:1.5;position:relative;color:#111;padding:.3125rem 1rem .3125rem 2.5rem; }
.profitBox ul li+li,.profit ul li+li { border-top:1px solid #ddd;color:#111; }
.profitBox ul li:before, .profit ul li:before { content: ''; display: block; width: 0.9375rem; height: 0.75rem; position: absolute; top: 0.5625rem; left: 1rem; background-image: url(/game_computer_store/img/check-green.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.profitBox { padding:0 1rem; }
.profit { padding-right:1rem;padding-bottom:0; }
.profitBox ul li,.profit ul li { padding-top:.625rem;padding-bottom:.625rem; }
.profitBox ul li:before,.profit ul li:before { top:.875rem; }
.profitBox li a { color:#111; }
.payment { border:1px solid #ddd;margin-bottom:1.25rem;padding:1rem; border-radius: 5px; min-height: 185px; }
.payment img { float: left; margin-bottom: 0px; margin-top: 5px; max-width: 260px; }
.payment ul, .payment li { float: left; margin-top: 0; margin-bottom: 0px; }
.payment p { line-height:21px;margin-bottom:0px;color:#111; }
.payment h4 { font-weight:700;margin-bottom:.3125rem; }
.benifitfooter { background: #fff; padding-top: 1.25rem; padding-bottom: 1.25rem; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; margin-bottom: 20px; }
.benifitfooter ul { text-align:center;margin:0; }
.benifitfooter ul li { line-height:1.2;display:inline-block;margin-top:.3125rem;margin-bottom:.3125rem;position:relative;font-size: 14px;padding-right:1.5625rem;padding-left:1.25rem; }
.benifitfooter ul li:before { content: ''; display: block; width: 0.875rem; height: 0.625rem; position: absolute; top: -1px!important; left: 0; background-image: url(/game_computer_store/img/check.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.advantages { background:#0090e2;padding-top:1.25rem;padding-bottom:1.25rem; border-bottom: 1px solid #fff; }
.advantages ul { text-align:center;margin:0; margin-top: -15px; }
.advantages ul li { line-height:1.2;display:inline-block;margin-top:.3125rem;margin-bottom:.3125rem;position:relative;font-size: 14px;padding-right:1.5625rem;padding-left:1.25rem; color:#fff; }
.advantages ul li:before { content: ''; display: block; width: 0.875rem; height: 0.625rem; position: absolute; top: 0.1875rem; left: 0; background-image: url(/game_computer_store/img/check.svg); background-position: center; background-repeat: no-repeat;background-size: 100% 100%; }
.continue { display: -webkit-flex; display: -ms-flexbox; display: flex; border-radius: 5px; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; background: #fff; padding: 0.625rem; color: #111; font-size: 14px; border:1px solid #ddd; }
.continue .continue-btn { margin-left: 15px; font-size: 14px; color: #111; }
.continue .continue-btn:before { content: ''; width: 0.5625rem; height: 0.875rem; display: inline-block; vertical-align: middle; margin-right: 0.625rem; background-image: url(/game_computer_store/img/angle-left-white.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
div.continue { margin:0 0 20px; border-radius: 5px; }
a.continue-btn-left:before { content: ''; width: 1rem; height: 0.6875rem; display: inline-block; margin-left: 20px; margin-right: 10px; background-image: url(/game_computer_store/img/back-arrow.png); background-position: center; background-repeat: no-repeat; background-size: 100%; }
.continue__shopping { margin-left:1.25rem; }
.continue__shopping:before { content: ''; width: 0.5625rem; height: 0.875rem; display: inline-block; vertical-align: middle; margin-right: 0.625rem; background-image: url(/game_computer_store/img/angle-left-white.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.continue__right p { display:inline-block;font-size:14px;color:#111;margin:0 .625rem; }

@media only screen and (max-width: 767px) {
    .payment { min-height: 165px; }
    .continue__right { display: block; }
    .continue__right p { display: block; margin: 1.25rem 0; }
}
@media only screen and (max-width: 1024px) {
    .continue { display: block; text-align: center;     }
    .continue__right { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }
}
.upsBox ul { list-style:none;overflow:hidden;margin:0 -30px 0px 0;padding:0; }
.upsBox ul li { position:relative;font-family: "DM Sans", sans-serif;padding-right:1.5625rem;padding-left:1.5625rem;color:#111; font-size: 13px; }
.upsBox ul li:before { content: ''; display: block; width: 1rem; height: 1rem; position: absolute; top: 4px; left: 0; background-image: url(/game_computer_store/img/list-blue.png); background-position: center; background-repeat: no-repeat; background-size: 100%; }
.upsBox h5 { font-weight:700;font-size: 14px;padding-top:.4375rem; }
.login-block { margin-bottom:10px; }
.settleBox { width:100%;overflow:hidden;padding:21px 0 10px; }
.settleBox h2 { font-size:28px;font-weight:700;margin:0; }
.settleBox h3 { font-size: 14px;font-weight:400;margin:5px 0 10px; }
.settleBox .contact { margin-top:16px;font-family: "DM Sans", sans-serif;font-weight: 900;font-size: 14px;color:#333;display:inline-block;text-align:left;padding:0 0 0 48px; }
.settleBox .contact span { display:block;font-weight:400; }
.settleBox .contact.whatsapp { margin-right:25px;background:url(/game_computer_store/img/svg/whatsapp-2.svg) left top no-repeat; }
.settleBox .contact.phone { background:url(/game_computer_store/img/svg/phone-3.svg) left top no-repeat; }
.settleBox .contact.phone:hover { color:000000;text-decoration:none; }
.settleBox.thanks { overflow:hidden;border:1px solid #ddd;margin:20px 0;padding:32px 32px 15px; }
.settleBox.thanks h2 { position:relative;font-family: "DM Sans", sans-serif;font-weight:700;font-size:24px;padding:0 0 0 100px; }
.settleBox.thanks h2:before { font-family:FontAwesome;content:"\f058";position:absolute;left:0;top:-10px;font-size:88px;color:#29cb85; }
.settleBox.thanks h2 span { font-family: "DM Sans", sans-serif;font-size: 14px;line-height:23px; }
.settleBox.thanks h3 { position:relative;font-family: "DM Sans", sans-serif;font-weight:400;font-size: 14px;line-height:23px;padding:0 0 0 100px; }
.contentBox { width:100%;overflow:hidden;font-family: "DM Sans", sans-serif;padding:30px 0; }
.contentBox .block { padding: 15px; width: calc(33.3% - 22px); float: left; overflow: hidden; margin: 0px 22px 22px 0; border: 1px solid #ddd; }
.contentBox .block:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.contentBox .title { font-size: 14px; }
.contentBox p.border { margin-top:15px;border-top:1px solid #ddd; }
.contentBox p { font-size: 14px;line-height:25px;padding:10px 0 0; }
.contentBox .fa { width: 36px; height: 36px; line-height: 36px; text-align: center; font-size: 18px; color: #fff; border-radius: 100%; }
.contentBox .block .fa-facebook { background:#3b5999; }
.contentBox .fa-twitter { background:#55acee; }
.contentBox .fa-instagram { background:#ff2e56; }
.contentBox .social li { float:left; }
.contentBox .bottom .detail { overflow:hidden;font-size: 14px;float:right;width:50%;padding:0 0 0 16px; }
.contentBox h3 { font-family: "DM Sans", sans-serif;font-size:21px;font-weight:700;line-height:27px;margin:0; }
.contentBox h3 span { font-size: 14px;display:block;font-weight:400; }
.contentBox .holder { margin-right:-22px;padding:20px 0 0; }
.sslBox { width: 100%; overflow: hidden; margin: 0 0 18px 0; }
.sslBox .ssl-btn { padding: 0px 11px 0px 25px; display: inline-block; position: relative; line-height: 29px; border: 1px solid #ccc; font-weight: bold; border-radius: 29px; float: left; margin-right: 15px; }
.sslBox .ssl-btn a { float: left; }
.sslBox .ssl-btn a:hover { float: left; text-decoration: none; }
.sslBox .ssl-btn:before { position: absolute; left: 9px; top: 0px;  font-size: 17px; font-family: 'FontAwesome'; content: "\f023"; color: #29cb85; }
.sslBox span { font-size: 14px;margin-top:4px;float:left; }
.address-box .block { font-family: "DM Sans", sans-serif;overflow:hidden;padding:4px 20px 10px; border: 1px solid #ddd; border-radius: 5px; }
.address-box .bezorgadres { margin-top:30px; }
.address-box input[type="checkbox"]{ outline:none;width:1.125rem;height:1.125rem;display:inline-block;vertical-align:middle;margin-top:3px;margin-left:-28px; }
.address-box .checkbox { margin-left:-11px; }
.address-box h4 { text-transform:uppercase;font-weight:700;font-size: 14px;margin:0;padding:15px 0; }
.address-box h5 { text-transform:uppercase;font-weight:700;font-size: 14px;margin-left:16px;padding:0px; }
.block.user-login { padding:0 20px; }
.user-login h4 { display:none; }
span.rata-mjesec { text-transform: uppercase; }
.method-box { border:1px solid #ddd;margin-bottom:1.625rem; border-radius: 5px; }
.method-box .rate-pay-banner { width:100%;height:24px; }
.method-box li { border-bottom: 1px solid #ddd; transition: all ease-in-out 300ms; }
.method-box li:hover { transition: all ease-in-out 300ms; }
.method-box h4 { text-transform:uppercase;font-weight:700;font-size: 14px;margin:0;padding:15px; }
.method-box.payment-box ul { margin-bottom:-1px; }
.method-box:hover {    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.method-box input[type="radio"] { display: none; }
.method-box label { width: 100%; padding: 11px 20px; cursor: pointer; margin: 0; font-weight: normal; line-height: 35px; transition: all ease-in-out 300ms; }
.method-box .delivery-title img, .method-box .shipment-title img, .method-box .payment-method-title img { margin-right: 10px; filter: grayscale(100%); float: left; }
.method-box label:hover, .method-box input[type="radio"]:checked~label { background: #ddd; transition: all ease-in-out 300ms; }
.method-box input[type="radio"]:checked~label img {filter: grayscale(0%); }
.method-box input[type="radio"]:checked+img { background: #6A1B9A !important; }
.method-box .price-label { margin: 0; padding: 0; font-size: 14px; float: right; font-weight: 500; line-height: 35px; background: transparent !important; color:#111; }
.method-box .price-label.freeshipping { color: #00b200; }
.method-box .block { font-family: "DM Sans", sans-serif;overflow:hidden;padding:5px 20px 20px; }
.method-box .block strong { font-size: 14px;text-transform:uppercase; }
.method-box .block p { font-size: 14px;font-weight: 500;color:#111; }
.method-box .select{ position:relative;width:100%;height:40px;display:inline-block; }
.method-box .select select { width: 100%; padding: 0 10px; height: 40px; font-family: "DM Sans", sans-serif; font-weight: 400; font-size: 14px; margin: 0; border: 1px solid #ddd; outline: none; display: inline-block; cursor: pointer; background: #fff!important; -webkit-appearance: none; -moz-appearance: none; color: #111 !important; }
.method-box .select:after { content:url('/game_computer_store/img/select-arrow-primary-light.png');position:absolute;top:1px;right:1px;pointer-events:none; }
.method-box .select.small { width:70%;position:relative;margin-top:-10px;margin-left:10px; }
.payment-box i { margin-left: 5px; color: #969696; font-size: 14px; transition: all ease-in-out 300ms; }
.payment-box i:hover { color: #e10717; transition: all ease-in-out 300ms; }
.payment-method-title p { line-height:21px; }
.yourorderBox { width:100%;overflow:hidden;margin-bottom:20px;border:1px solid #ddd; border-radius: 5px; }
.yourorderBox:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.yourorderBox h4 { text-transform:uppercase;font-weight:700;font-size: 14px;margin:0;padding:15px; }
.yourorderBox ul { list-style:none;margin:0; }
.yourorderBox li { overflow:hidden;position:relative;font-family: "DM Sans", sans-serif;font-weight:400;font-size: 14px;border-top:1px solid #ddd;padding:13px 15px; }
.yourorderBox li .right { width:120px;float:right; font-weight: 900; }
.yourorderBox .ukupno { text-transform:uppercase; }
.yourorderBox li .right small { clear:both;float:left;color:#969696; font-size: 11px; font-weight: normal; }
.yourorderBox .block { overflow:hidden; }
.yourorderBox .subtitle { font-size: 14px;display:block;font-family: "DM Sans", sans-serif;font-weight:400;padding:0 0 12px; }
.yourorderBox .image { width:50px;float:left; }
.yourorderBox .image img { width: 100%; border-radius: 2px; }
.yourorderBox .detail { width: calc(100% - 50px); float: right; padding-left: 10px; }
.yourorderBox .detail .icons { border: 1px solid #ddd; overflow: hidden; display: inline-block; border-radius: 25px; }
.yourorderBox .detail .icon { width:45px;height:40px;line-height:40px;text-align:center;text-decoration:none;color:#676767;border-right:1px solid #ddd;float:left; }
.yourorderBox .detail .icon.icon-quantity { width:60px; }
.yourorderBox .detail span.qty { font-size: 14px; }
.yourorderBox .detail .setting { background:url(/game_computer_store/img/setting.png) center center no-repeat; }
.yourorderBox .detail input[type="text"]{ width:45px;float:left;line-height:40px;border:none;text-align:center;padding:0 10px; }
.yourorderBox .detail .price { font-size: 14px;display:inline-block;position:relative;top:-17px;min-width:80px; text-transform: uppercase; }
.yourorderBox .orange { color:#00b200; }
.yourorderBox .total { font-size: 14px; font-weight: 900; }
.yourorderBox .midtitle{text-transform:uppercase;font-weight:700;font-size: 14px; }
.yourorderBox .block2 { overflow:hidden;padding:0 20px 20px; }
.yourorderBox .btn.btn-success { margin-bottom: 15px; transition: all ease-in-out 300ms; }
.yourorderBox p.confirm-message { margin: 0; color: #111; font-size: 12px; }
.yourorderBox p.confirm-message a { color: #969696; text-decoration: underline; }
.yourorderBox .checkbox label { display: inline-block; cursor: pointer; position: relative; padding-left: 25px; margin-right: 15px; font-family: "DM Sans", sans-serif; font-weight: 500; font-size: 14px; line-height: 24px; }
.yourorderBox .btn.btn-success { border-color: #00b900; background-color: #00b900; color: #fff; font-size: 15px; font-weight: 700; border: 0;  position: relative; }
.yourorderBox .btn.btn-success:after { background-image: url(/game_computer_store/img/angle-right-white.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; content: ''; display: block; width: 0.5rem; height: 0.875rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; right: 0.8125rem; }
.yourorderBox .btn.btn-success:hover { color: #fff; border-color: #00b900; background-color: #00b900; transition: all ease-in-out 300ms; }
.fa-minus:before, .fa-plus:before { font-size: 10px; }
.deliveryBox { padding: 28px 0px; width: 100%; overflow: hidden; }
.deliveryBox .holder { margin-right: -20px; }
.deliveryBox .block { margin: 0px 20px 0px 0px; width: calc(50% - 20px); float: left; border: 1px solid #ddd; }
.deliveryBox .block:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.deliveryBox .btn.btn-default:first-of-type { color: #f60;  border-color: #f60; margin-right: 0.625rem; }
.deliveryBox .title { padding: 0 20px; line-height: 48px; font-size: 14px; display: block; text-transform: uppercase; font-weight: bold; border-bottom: 1px solid #ddd; }
.deliveryBox .inner { padding: 20px; overflow: hidden; font-family: "DM Sans", sans-serif; font-size: 14px; }
.deliveryBox .btn-success { max-width: 300px; min-width: 250px; float: left; }
.deliveryBox p { margin: 0px; padding: 0px 0px 18px 0px; line-height: 23px; }
.deliveryBox ul { list-style: none; }
.deliveryBox li { overflow: hidden; font-size: 14px; line-height: 23px; }
.deliveryBox li .right_text { width: 60px; float: right; }
.deliveryBox .left { width: 380px; float: left; }
.deliveryBox .right { padding: 0px 0px 0px 24px; width: 130px; float: left; font-weight: 800; }
.deliveryBox .right .total { font-size: 21px; }
.deliveryBox .buttons { padding: 26px 0px 0px 0px; }
.deliveryBox .buttons .btn-default { padding: 0.9375rem 1.85rem; margin-bottom: 10px; }
.deliveryBox .buttons i { padding: 0px 10px 0px 0px; }
.deliveryBox .button { margin: 0px 3px; width: calc(50% - 6px); float: left; text-align: center; display: block; line-height: 42px; font-family: "DM Sans", sans-serif; font-size: 14px; text-decoration: none; border: 1px solid #dcdcdc; border-radius: 2px; }
.deliveryBox .button:hover, .deliveryBox .button.active { background: #272727; color: #fff; border: 1px solid #272727; border-radius: 2px; }
.deliveryBox .input { padding: 0px 0px 0px 40px; position: relative; width: 60%; float: left; line-height: 47px; border: 1px solid #ddd; }
.deliveryBox input[type="text"] { padding: 0px 10px; width: 100%; float: left; line-height: 47px; border: none; font-family: "DM Sans", sans-serif; font-size: 14px; }
.deliveryBox input[type="password"] { padding: 12px 0px 13px 0; width: 100%; float: left; line-height: 19px; box-shadow: none; border: none; font-family: "DM Sans", sans-serif; font-size: 18px; height: 100%; }
.deliveryBox .input:before { position: absolute; left: 13px; top: 2px; font-size: 22px; font-family: 'FontAwesome'; content: "\f023"; color: #7f7f7f; }
.deliveryBox .create_btn { margin: 0px 0 0 10px; width: calc(40% - 10px); float: left; text-align: center; display: block; font-family: "DM Sans", sans-serif; font-size: 16px; color: #fff; font-weight: bold; text-decoration: none; border: 1px solid #29cb85; border-radius: 2px; background: #29cb85; }
.deliveryBox .create_btn:hover { text-decoration: none; background-color: #28d58a; }
.deliveryBox .tip { padding: 22px 0px 0px 0px; font-family: "DM Sans", sans-serif; font-size: 14px; }
.deliveryBox .tip .arrow { position: relative; display: inline-block; }

@media only screen and (max-width: 479px) {
    .deliveryBox { padding: 0px; }
    .deliveryBox .block { width: 90%!important; }
    .deliveryBox .right, .deliveryBox .left { padding: 0px; width: 100%; }
    .contentBox .block { width: 100%!important; }
}

.timeBox { width:100%;line-height:45px;border:1px solid #ddd;position:relative;margin-bottom:20px;border-radius: 3px;text-align:center; }
.timeBox p { font-size: 14px;color:#333;margin:0; }
.timeBox .clock { color:#75c8ff;font-size:24px;position:relative;top:5px;margin-right:10px; }
.timeBox .corss{ position:absolute;right:20px;top:13px;font-size:18px;color:#9f9f9f; }
.timeBox a:hover { color:#333;text-decoration:none; }
.headwrap { margin-bottom: 10px; }
.page-header h1 { margin-bottom:5px;font-size: 26px;
    color: #285dab;
    font-weight: 700;
    margin-bottom: 5px;
    font-family: "Roboto Slab", serif;
}
.page-header { padding-bottom:0;border-bottom:0 solid #eee;margin:0; }

.heading__time { color: #111; float: right; position: relative; max-width: 100%; font-size: 14px; }
.heading__time strong { color: #090; }
.heading__time:before { content: ''; height: 100%; display: block; width: 40px; position: absolute; top: 0; left:-40px; background-image: url(/game_computer_store/img/clock.svg); background-position: center; background-repeat: no-repeat; background-size: 20px; }
@media only screen and (max-width: 767px) {
    .heading__time { float:none;max-width:100%;margin-top:10px; line-height: 18px; }
}
.textBox .title { font-size:36px;color:#e10817;font-weight:700; }
.textBox .subtitle { display:block;font-size:16px;padding:0 0 20px; }
.textBox p { font-size: 14px;line-height:21px;padding:0 0 30px; }
.textBox a { color:#e10817;text-decoration:underline; }
.textBox a:hover { text-decoration:none; }
.textBox h3 { font-size:22px;font-weight:700; }
.textBox h4 { font-size:22px;font-weight:700;margin:20px 0 10px; }
.textBox,.textBox img { width:100%; }
.addressBox { width:100%;overflow:hidden; }
.addressBox .blok { padding: 30px 15px 25px 22px; margin-bottom: 20px; height: calc(100% - 20px); width: 100%; overflow: hidden; font-size: 14px; color: #333333; line-height: 24px; border: 1px solid #ddd; border-radius: 2px; }
.addressBox .blok.gray { background:#fbfbfb; }
.addressBox h4 { padding-bottom:5px;font-size:18px;padding-left:0;font-weight:700;margin:0; }
.addressBox p { margin:0; }
.addressBox span { width:154px;display:block;float:left; }
.addressBox .right { width: calc(100% - 154px); float: left; }
.addressBox a.red { color:#e10817;text-decoration:underline; }
.addressBox a { text-decoration:underline; }
.addressBox a:hover { text-decoration:none; }
.webshopreviewsBox { width:100%;overflow:hidden;padding:20px 0 60px; }
.webshopreviewsBox h2 { padding-bottom:5px;font-size:22px;font-weight:700;margin:0; }
.webshopreviewsBox p { font-size: 14px;line-height:21px;margin:0;padding:0 0 25px; }
.webshopreviewsBox .blok { position: relative; padding: 20px 20px 60px 20px; margin-bottom: 20px; height: calc(100% - 20px); width: 100%; overflow: hidden; border: 1px solid #ddd; border-radius: 2px; }
.webshopreviewsBox img { display: inline-block; }
.webshopreviewsBox h3 { font-size: 18px; font-weight: bold; }
.webshopreviewsBox .btn-primary { position: absolute; bottom: 20px; width: calc(100% - 40px); padding: 6px 12px; display: block; font-size: 14px; }
.maintitle { font-size: 26px; color: #fff; font-weight: 800; margin-bottom: 5px; }
.mainsubtitle { display: block; font-size: 16px; }
.row-flex { flex-wrap: wrap; align-items: stretch; display: flex; flex-direction: row; justify-content: flex-start; }
.supportcolumn { padding:15px 0 0 15px;margin-bottom:20px;width:100%;overflow:hidden;border-left:1px solid #f2f2f2; }
.supportcolumn h3 { margin:0;padding-bottom:10px;font-size:18px;border-bottom:1px dashed #ddd; }
.supportcolumn ul { padding:0;list-style:none;overflow:hidden;border-bottom:1px solid #ddd; }
.supportcolumn ul li { position:relative;line-height:26px;font-size: 14px;color:#333; }
.supportcolumn ul li a { padding:0 0 0 16px;color:#333;text-decoration:none; }
.supportcolumn ul.supportmenu li a:before { position:absolute;left:0;top:10px;content:'';width:5px;height:5px;background:#e10817; }
.supportcolumn ul.supportmenu li a:hover,.supportcolumn ul.supportmenu li.active a { color:#e10817;text-decoration:underline; }
.supportcolumn strong { padding:6px 0 5px;display:block;font-size: 14px; }
.supportcolumn ul:last-child { border: none; }
.category-tile { margin-bottom: 20px; }
.accountBox button.btn { padding: 0 15px 0 0 !important; }
.accountBox button.btn:hover { text-decoration: none; }
.accountBox .dropdown-menu { display: block; border-radius: 2px; padding: 10px; list-style: none; position: absolute; top: 33px; left: 0px; width: 230px; display: none; background-color: #fff!important; border-radius: 3px; -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%); box-shadow: 0 6px 12px rgb(0 0 0 / 18%); border: 1px solid #ddd; }
.accountBox .dropdown-menu li { display: block; }
.accountBox .dropdown-menu.mainmain li { text-align: left; }
.accountBox .dropdown-menu li:last-child { border-bottom: 0; }
.accountBox .dropdown-menu li a { transition: background .1s linear; display: block; line-height: 40px; padding: 0 12px; text-decoration: none; color: #111; font-size: 14px; }
.accountBox .dropdown-menu li a:hover { background: #ddd; color: #111; }
.accountBox .dropdown-menu li span.count{ float:right;width:20px;height:20px;text-align:center;line-height:20px;background:#28d58a;font-size: 14px;color:#fff;border-radius:50%;margin-right:5px;margin-top:10px; }
.accountBox:hover .dropdown-menu{display:block}
.accountBox .btn .icon{display:inline-block;height:42px;width:36px;text-align:center;line-height:43px;padding-left:12px}
.myaccountBox { width:100%;overflow:hidden; }
.myaccountBox .topBox{width:100%;overflow:hidden;padding:23px 0 0}
.myaccountBox .topBox .sslBox { padding-bottom:50px;overflow:hidden}
.myaccountBox .topBox .sslBox span{padding:0px 0 50px;overflow:hidden;float:left}
.myaccountBox .topBox .sslBox a{float:left;margin-right:10px}
.myaccountBox .topBox .sslBox a:hover{text-decoration:none; }
.myaccountBox .headmain-left{float:left}
.myaccountBox .headmain-right{float:right}
.myaccountBox .head{padding:0 0 20px;overflow:hidden}
.myaccountBox .head h2{margin:0;font-size:26px;font-weight:700}
.myaccountBox .head h2 span{padding:5px 0 0;font-size: 14px;display:block;font-weight:400}
.myaccountBox span{padding:5px 0 0;font-size: 14px;display:block;font-weight:400}
.myaccountBox ul.tabs{float:right;clear:both}
.myaccountBox ul.tabs li{float:left;margin-left:3px}
.myaccountBox ul.tabs li a { padding: 0px 25px; line-height: 33px; font-size: 14px; text-decoration: none; display: block; background: #f7f7f7; border-radius: 2px; }
.myaccountBox ul.tabs li a:hover, .myaccountBox ul.tabs li.active a { background: #ddd; color: #fff; }
.myaccountBox .holder { width: 100%; padding: 25px 0px 36px 0px; box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.1); }
.myaccountBox .holder .left { width: 412px; float: left; }
.myaccountBox .holder .right { padding: 0px 0px 0px 20px; width: calc(100% - 412px); float: left; }
.myaccountBox .block { padding: 23px 30px; margin-bottom: 18px; overflow: hidden; background: #fff; border: 1px solid #ddd; }
.myaccountBox .block:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.myaccountBox .block h5 { margin: 0px; font-size: 22px; font-weight: bold; padding-bottom: 5px; }
.myaccountBox .block p { margin: 0px; font-size: 14px; line-height: 23px; }
.myaccountBox .recent { background: #fff; margin-bottom: 18px; overflow: hidden; border: 1px solid #ddd; }
.myaccountBox .recent:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.myaccountBox .recent strong{padding:16px 22px;font-size:18px;font-weight:700;display:block}
.myaccountBox .recent ul{margin:0;list-style:none; }
.myaccountBox .recent li{padding:7px 7px 7px 22px;line-height:26px;display:block;border-top:1px solid #ddd;font-size: 14px; }
.myaccountBox .recent li a{text-decoration:none; }
.myaccountBox .recent li a:hover{text-decoration:underline}
.myaccountBox .recent li span{display:inline-block;width:90px;text-align:right}
.myaccountBox .recent li .button { width: 117px; text-align: center; float: right; font-size: 14px; color: #fff; text-decoration: none; display: inline-block; background: #29cb85; line-height: 26px; border-radius: 2px; padding: 0px; margin: auto; }
.myaccountBox .recent li .button.orange { background: #ff831f; }
.myaccountBox .recent li .button.blue { background: #1fbdff; }
p.voorwaarden { color: #111; font-size: 12px; }
span.required { display: none; }
.block.block-account { margin: 30px 0 30px 0; }
.nova-lozinka { margin-top: 10px; }
#loginCntr h2 { margin:0;font-size:26px;font-weight:700;margin-top:20px; }
#loginCntr h2 span { padding:5px 0 0;font-size: 14px;display:block;font-weight:400}
#loginCntr .holder { padding:23px 0 0}
#loginCntr .column { margin-right:22px; width:calc(36% - 22px); float:left; }
#loginCntr .column2 { width:28%;float:left}
#loginCntr .loginBox,.newsBox { margin:0;padding:20px; }
#loginCntr .loginBox strong { font-size:22px;display:block;margin-bottom:5px; }
#loginCntr .input input {  box-shadow: none; outline: none; display: block; width: 100%; max-width: 100%; height: 2.5rem; font-family: "DM Sans", sans-serif; color: #111; border: 1px solid #ddd; border-radius: 5px; background: transparent; padding: 0.3125rem 0.9375rem; font-size: 14px; color: #111!important; }
@media only screen and (max-width: 767px) {
    #loginCntr .column { width:100%;margin:0 0 20px; }
    #loginCntr .column2 { width:100%; }
}
.newsBox { height:100%;width:100%;overflow:hidden;position:relative;border:1px solid #ddd}
.newsBox h2 { font-size:22px;margin:0 0 8px;font-weight:700}
.newsBox p { font-family: "DM Sans",sans-serif;font-weight: 500;font-size: 14px;line-height:24px; }
.newsBox strong { font-size:22px;display:block;margin-bottom:5px; }
.loginBox { width:100%;position:relative;border:1px solid #ddd; border-radius: 5px; }
.loginBox:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.loginBox ul { display: -webkit-flex; display: -ms-flexbox; display: flex; }
.loginBox li { width: 50%; float: left; text-align: center; }
.loginBox li a { display:block;font-weight:700;text-align:center;color:#111;text-transform:uppercase;background:#ddd;border-bottom:1px solid #ddd;padding: 12px 0px 7px 0px; font-size: 14px; }
.loginBox li a:hover,.loginBox li.active a { background:none;border-bottom-color:transparent}
.loginBox .hidden-block { display:none; }
.loginBox input[type="text"],.loginBox input[type="password"],.loginBox input[type="number"]{ padding:0 5px;line-height:40px;width:100%;font-family: "DM Sans",sans-serif;font-weight:400;font-size: 14px;border:none;height:40px; }
.loginBox .input { width:100%; margin-bottom: 20px; }
.loginBox .form-row { margin-top: 0px; width: 100%; overflow: hidden; padding-bottom: 15px; }
.loginBox .holder2 { margin-right:-16px; }
.loginBox .col { width: 50%; float: left;  padding: 0px 16px 0px 0px; }
.loginBox .col2 { width: 45%; float: left; }
.loginBox .col3 { width: 55%; float: left; }
.loginBox .input.no-border { border-left: none; }
.loginBox .input.passcode:before { font-family: 'FontAwesome'; position: absolute; left: 15px; top: 5px; color: #808080; font-size: 22px; content: "\f041"; }
.loginBox .straat{padding:0 12px;position:relative;border:1px solid #ddd;border-top:none;font-family: "DM Sans",sans-serif;font-weight:400;font-size: 14px;color:#5d5d5d;line-height:40px;display:block}
.loginBox .straat:after { font-family:'FontAwesome';position:absolute;right:15px;color:#bfbfbf;font-size:16px;content:"\f067"}
.loginBox .select{position:relative;width:100%;height:44px;display:inline-block}
.address-box select { background-image: url(/game_computer_store/img/angle-down-white.svg) !important; background-position: right !important; background-repeat: no-repeat !important; background-size: 1.875rem !important; }
.address-box option { background: #fff; }
.default-box.checkout-review-load.cart-container { padding: 0; }
.loginBox .select select { width: 100%; padding: 0 10px; height: 44px; font-family: "DM Sans", sans-serif; font-weight: 400; font-size: 14px; color: #5d5d5d; margin: 0; border: 1px solid #ddd; border-top: none; outline: none; display: inline-block; cursor: pointer; background: #111; -webkit-appearance: none; -moz-appearance: none; }
.loginBox .select:after { content: url('/game_computer_store/img/select_arrow2.png'); position: absolute; top: 1px; right: 1px; pointer-events: none; }
.loginBox .checkbox label { display: inline-block; cursor: pointer; position: relative; padding-left: 25px; margin-right: 15px; font-family: "DM Sans", sans-serif; font-weight: 500; font-size: 14px; color: #111; }
.loginBox .tip { position:absolute;right:0;top:0}
.loginBox .info{color:#949494;font-size:18px}
.loginBox .info:hover{text-decoration:none; }
.loginBox.block2{padding:0 20px;width:100%;border:1px solid #ddd}
.loginBox .button { width: 100%; float: left; text-align: center; display: block; line-height: 42px; font-family: "DM Sans", sans-serif; font-size: 16px; color: #fff; text-decoration: none; border-radius: 2px; background: #29cb85; border: none; padding: 3px 33px; }
.loginBox .button:hover { background: #28d58a; transition: background .1s linear; }
.loginBox p { font-family: "DM Sans",sans-serif;font-weight: 500;font-size: 14px;line-height:24px; }
.sslBox { width:100%;overflow:hidden}
.sslBox .ssl-btn { padding:0 11px 0 25px;display:inline-block;position:relative;line-height:29px;border:1px solid #ccc;font-weight:700;border-radius:29px; }
.sslBox .ssl-btn a { float:left}
.sslBox .ssl-btn a:hover { float:left;text-decoration:none; }
.sslBox .ssl-btn:before{position:absolute;left:9px;top:0;font-size:17px;font-family:'FontAwesome';content:"\f023";color:#29cb85}
.gameLaptopsBox .block p { display:none; }
.gameLaptopsBox .ratings>.review-count{display:inline-block!important}
.title.pcs { margin:0 0 5px; }
.accessoiresBox { width:100%; }
.accessoiresBox h2 { font-family: "DM Sans",sans-serif;padding:25px 0 18px;float:left;margin:0;font-size:22px;font-weight:700;float:left}
.accessoiresBox h2 span{padding:0 0 0 22px;display:inline-block;font-size: 14px;color:#727272;line-height:22px;font-weight:400}
.accessoiresBox ul{list-style:none;margin-top:10px;padding:0;clear:both}
.accessoiresBox>li{padding:22px 20px 50px;margin-bottom:22px;min-height:325px;width:25%;float:left;position:relative}
.accessoiresBox .slick-dots li{position:relative;display:inline-block;height:20px;width:20px;margin:0 5px;padding:0;cursor:pointer;float:none;min-height:unset}
.accessoiresBox .image { padding: 13px 0 10px; width: 100%; }
.accessoiresBox .image img{width:100%;max-width:180px;margin:0 auto}
.accessoiresBox .price { font-size:16px;display:block;font-weight:700;margin-top:10px}
.accessoiresBox h3 a,.accessoiresBox h4 a { font-family: "DM Sans",sans-serif;margin:0 0 5px;font-size:16px;font-weight:700}
.accessoiresBox h3 a:hover,.accessoiresBox h4 a:hover{color:#e10817;text-decoration:none; }
.accessoiresBox p { font-size: 14px;line-height:23px;clear:both;margin-bottom:17px}
.accessoiresBox .subtitle{padding:0 0 10px;font-size:18px;color:#004572}
.accessoiresBox a.stelsamen{position:absolute;bottom:20px;width:calc(100%-40px);padding:9px 12px;display:block}
.accessoiresBox li:hover a.stelsamen,.accessoiresBox li a.stelsamen:hover{background:#95d742;transition:background .1s linear}
.accessoiresBox li:hover .subtitle,.accessoiresBox li.active .subtitle{color:#29cb85}
.accessoiresBox li.active strong{color:#29cb85}
.accessoiresBox li.active a{background-color:#29cb85}
.accessoiresBox .pctop li{padding:0 9px 0 0;width:25%}
.accessoiresBox .pctop li .block{padding:26px 21px 10px;background:#fff;-webkit-box-shadow:0 0 4px 3px #f4f3f3;box-shadow:0 0 4px 3px #f4f3f3}
.accessoiresBox .pctop li h2{padding:0 0 10px;font-size:17px;color:#004572;min-height:57px}
.accessoiresBox .pctop li h2.pcs{min-height:26px!important;margin:0}
.accessoiresBox .pctop li h2 a{color:#004572}
.accessoiresBox .pctop li h2 a:hover{color:#12aaeb;text-decoration:none; }
.accessoiresBox .ratings>.call-to-action{display:none; }
@media only screen and (max-width: 767px) {
    .newsBox .btn { position: static; width: 100%; }
}
@media only screen and (max-width: 479px) {
    .accessoiresBox h2 { font-size:22px; }
    .step ul li:first-child { padding-top:47px!important; }
    .ordering__head .btn { width:100%!important; }
}
.linksBox { width:100%;border:1px solid #ddd; border-radius: 5px; }
.linksBox h4 { margin-bottom:0;text-transform:none;font-weight:700;font-size:16px;color:#111;padding:15px; }
.linksBox ul { list-style:none; }
.linksBox li,.linksBox .nav-stacked li { font-size: 14px;margin-top:0; }
.linksBox .nav-stacked li:hover { background: #f2f7fc; }
.linksBox li a { display: block; padding: 10px 15px; color: #111; text-decoration: none; border-radius: 0; border: none; }
.linksBox li a:hover { background: #f2f7fc; color: #007bff; border-radius: 0; }
.linksBox li.active a { background: #f2f7fc; color: #007bff; box-sizing:border-box; display:inline-block;padding:10px 15px;width:100%;font-size: 14px;border-radius:0; }
.linksBox li.active a:hover { background:#0090e2; }
.linksBox li.active { border-left: 3px solid #0090e2; }
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { color: #111; background-color: #f2f7fc; }

.box-account h4 { color:#e10817}
.box-account address { font-size: 14px;color:#111;line-height:24px;border:1px solid #ddd;padding:15px;margin:15px 15px 15px 0; border-radius: 5px; }
.box-account a.adres { font-size: 14px; color: #111; background: #fff; line-height: 25px; padding: 5px 10px; border: 1px solid #ddd; border-radius: 2px; float: left; }
.box-account a.adres:hover { color:#111;border:1px solid #ddd;text-decoration:none; }
.box-account p { padding:4px; }
.box-head h2 { color:#111}
.box-title { overflow:hidden;color:#111}
.box-title h3 { float:left;font-size:16px; }
.box-title a { margin: 4px; }
.invoice-address { width: 100%; clear: both; }

.my-account { margin:30px 0;font-size: 14px; width: 100%; border: 1px solid #ddd; border-radius: 5px; padding: 20px; }
.my-account .fieldset { margin:15px 0;border:1px solid #ddd;background:#fff}
.my-account .fieldset .form-list .field { float:left;width:345px; }
.my-account .fieldset .button[type="submit"]{ margin-top:30px; }
.my-account .buttons-set { margin-bottom:20px; }
.my-account .button { display: inline-block; background: #29cb85; padding: 0 20px; font-size: 16px; text-align: center; white-space: nowrap; color: #111; border-radius: 2px; line-height: 40px; border: none; }
.my-account .button:hover { background: #95d742; transition: background .1s linear 0; }
.my-account .button.sluiten { background: #282828; float: left; margin-top: 10px; }
.my-account .ticketbuttons{margin:20px 0}
.my-account textarea#message{padding:10px;font-size: 14px;color:#111;line-height:24px}
.my-account .welcome-msg{margin-bottom:0}
.my-account .dashboard{margin-bottom:20px}
.my-account .dashboard p,.my-account p { font-size: 14px;color:#111;line-height:24px}
.my-account .amount{display:none; }
.my-account .limiter{margin:20px 0}
.my-account strong { font-size:16px;color:#111;display:block;font-weight:400}
.my-account h1{padding:0 0 5px;font-size:23px;color:#0090e2;margin:0;font-weight:700}
.my-account h2{padding:15px 0;font-size:14px;color:#111;margin:0;font-weight:700}
.my-account h3{padding-bottom: 20px;padding-top: 20px; font-size: 14px; color: #111; margin: 0; }
.my-account h4 { padding-top:10px;font-size:14px;color:#111;margin:0; font-weight: 900;}
.my-account .addresses-list{margin-top:20px; }
.my-account .addresses-list ol{padding:0}
.my-account .addresses-list ol address { font-size: 14px;line-height:24px;margin:15px 0;padding:15px;border:1px solid #ddd}
.my-account .dashboard h4 i{ color:#111;font-size:16px}
.my-account .data-table{margin:0 0 30px}
.my-account .data-table thead th { padding:6px 5px;font-size:12px;font-size: 14px;color:#111;line-height:24px}
.my-account tr,.my-account td { font-size: 14px;color:#111;line-height:24px}
.my-account .alle{margin:15px 0;float:right}
.my-account ul.form-list{line-height:26px}
.my-account select{ min-height:36px; color:#111; }
.my-account option { background:#fff; color:#111; }
.my-account .form-list label { font-size: 14px;padding:0 2px 3px 0}
.my-account .short{padding:0 15px 40px!important}
.my-account .ticket-history .fieldset.customer { font-size: 14px;color:#282828;line-height:24px;padding:15px}
.my-account .ticket-history .fieldset.customer ul{padding:0}
.my-account .ratings-table{margin:10px;float:right}
.my-account .review-pregled { margin-top:10px}
.my-account .stars h4 { font-size:18px;font-weight:400;padding:0 10px 0 0}
.my-account .stars h3 { font-size:16px;font-weight:400;padding:0 10px 10px 0}
.my-account .pcnl-info-text { font-size: 14px; }
.my-account .pcnl-manual-checkbox { clear:both}
.my-account .fieldset .pcnl-info-label { font-size:17px;color:#111;margin:0}
.my-account .dl-horizontal dd { border-bottom: 1px solid #ddd; margin-top: 13px; }
.my-account .product-img-box { float: left; margin-right: 30px; padding: 10px; border: 1px solid #ddd; border-radius: 5px; }
.select2-results, .select2-search--dropdown { background: #fff!important; font-size: 14px;  }
.data-table{width:100%}
.data-table td.last,.data-table th.last { border-right:0}
.data-table tr.last th,.data-table tr.last td { border-bottom:0}
.data-table th { padding:8px;font-weight:700}
.data-table td { padding:10px}
.data-table thead th { font-weight:700;padding:10px;white-space:nowrap;vertical-align:middle;font-size: 14px; }
.data-table thead th.wrap { white-space:normal; }
.data-table thead th a,.data-table thead th a:hover{color:#fff}
.data-table thead th { background:#f2f7fc;border-bottom:1px solid #ddd}
.data-table thead th .tax-flag { font-size:11px;white-space:nowrap}
.data-table tfoot { border-bottom:1px solid #ddd}
.data-table tfoot tr.first td { border:0;padding:0}
.data-table tfoot td { border-bottom:1px solid #ddd;border-right:1px solid #ddd}
.data-table tfoot strong { font-size:16px}
.data-table tbody th,.data-table tbody td { border-bottom:1px solid #ddd}
.data-table tbody.odd tr td,.data-table tbody.even tr td { border-bottom:0}
.data-table tbody.odd tr.border td,.data-table tbody.even tr.border td { border-bottom:1px solid #d9dde3}
.data-table tbody td .option-label { font-weight:700;font-style:italic}
.data-table tbody td .option-value { padding-left:10px}
.data-table em { font-style:normal; }

form#create_ticketForm { padding:30px}
form#create_ticketForm ul.form-list{width:80%;margin:0 0 30px;padding:0}
form#create_ticketForm h2{padding:0 0 15px;font-size:22px;margin:0}
form#create_ticketForm button { display:block; background:#00b200; padding:0 20px;font-size: 14px;text-align:center; white-space:nowrap; color:#fff; border-radius:5px; line-height:40px;border:none; transition: 0.3s ease-in-out;  }
form#create_ticketForm button:hover { background-color: #00cf00; transition: 0.3s ease-in-out; opacity: 0.8; }
.slick-dots { position: absolute; bottom: 5px; list-style: none; display: none; text-align: center; padding: 0; width: 100%; }
.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0; font-size: 0; color: transparent; padding: 5px; cursor: pointer; }
.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }
.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }
.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "\2022"; width: 20px; height: 20px; font-family: "slick"; font-size: 40px; line-height: 20px; text-align: center; color: #fff; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-dots li.slick-active button:before { color: #fff; }
.media { position: relative; width: 100%; padding: 20px; border: 1px solid #fff; position: relative; margin-bottom: 20px; padding: 20px; border-radius: 5px; }

.productSliderVertical:after { clear: both; display: block; content: ''; }
.productSliderVertical .discount { position: absolute; right: 20px; top: 20px; width: 137px; height: 36px; text-align: center; line-height: 36px; font-size: 14px; color: #fff; text-decoration: none; background: #ff6600; border-radius: 2px; }
.productSliderVertical .left { float: left; width: 147px; }
.productSliderVertical .right { float: right; width: calc(100% - 147px); }
.productSliderVertical .right.single { width: 100%; }
.productSliderVertical img { width: 100%; height: auto; }
.productSliderVertical .galleryNav ul { list-style: none; }
.productSliderVertical .galleryNav[data-focusOnSelect="false"] .slick-track { -webkit-transform: translate3d(0, 0, 0) !important; -moz-transform: translate3d(0, 0, 0) !important; -ms-transform: translate3d(0, 0, 0) !important; -o-transform: translate3d(0, 0, 0) !important; transform: translate3d(0, 0, 0) !important; }
.productSliderVertical .galleryNav .slick-vertical .slick-slide { border: 0; }
.productSliderVertical .galleryNav .slick-slide { cursor: pointer; }
.productSliderVertical .galleryNav .slide { float: left; width: 100%;  margin: 0.625rem 0; padding: 2px; }
.productSliderVertical .galleryNav>.slide:not(.active) { display: none; }
.productSliderVertical .galleryNav .block { border: 1px solid #ddd; height: 140px; transition: 0.3s ease-in-out; margin-top: -12px; }
.productSliderVertical .galleryNav .block:hover { border: 1px solid #0090e2; transition: 0.3s ease-in-out; }
.productSliderVertical .galleryNav .block:active { border: 1px solid #0090e2; transition: 0.3s ease-in-out; }
.productSliderVertical .galleryNav .block img { display: block; max-width: 100px; margin: auto; padding-top: 20px; }
.productSliderVertical .gallery .slide { display: inline-block; width: 100%; }
.productSliderVertical .gallery>.slide:not(.active) { display: none; }
.productSliderVertical .gallery img { display: block; text-align: center; max-width: 500px; margin: auto; }
.popupBox .productSliderVertical .gallery img { max-width: 980px; }

@media only screen and (max-width: 476px) {
    .productSliderVertical .galleryNav .block { border: 1px solid #ddd; height: 100px; width: 100px; transition: 0.3s ease-in-out; padding: 10px; border-radius: 5px; margin-top: -9px; background: #fff !important; }
    .productSliderVertical .galleryNav .block img { padding-top: 3px!important; width: 85%; }
    .korpabtn { padding: 11px!important; }
}

@media only screen and (max-width: 1024px) {
    .productSliderVertical .left { width:100%;padding:20px 0 0; margin-top: -110px; }
    .productSliderVertical .right { width:100%;height:auto; }
    .productSliderVertical .galleryNav .slide { width:25%; background: #fff; }
    .productSliderVertical .gallery .slide { padding:0; }
    .productSliderVertical .gallery img { max-height:none; }
}

@media only screen and (max-width: 360px) {
    .productSliderVertical .galleryNav .block {
            border: 1px solid #ddd;
            height: 80px;
            width: 79px;
            transition: 0.3s ease-in-out;
            padding: 10px;
            border-radius: 5px;
            margin-top: -9px;
            background: #fff !important;
        }
}

.description_textBox { padding: 20px 20px 20px 20px; width: 100%; border: 1px solid #ddd; color: #111; border-radius: 5px; }
.description_textBox h5 { margin: 0px; padding-bottom: 10px; font-size: 18px; font-weight: 700; color: #0090e2; }
.description_textBox p { padding-bottom: 20px; margin: 0px; font-size: 14px; color: #111; line-height: 21px; }
.description_textBox ul { list-style: none; padding: 0; }
.description_textBox table { width: 100%; }
.description_textBox table>tbody>tr td { border: 0; font-size: 14px; }
.description_textBox table>tbody>tr:nth-child(even) td { background: #ddd; padding: 8px; line-height: 1.42857143; font-size: 14px; }
.description_textBox table>tbody>tr:nth-child(odd) td { background: #111; padding: 8px; line-height: 1.42857143; font-size: 14px; }
.description_textBox table>tbody>tr { font-size: 14px!important; }

.specificatiesBox { padding: 20px; margin-top: 30px; width: 100%; border: 1px solid #ddd; border-radius: 5px; }
.specificatiesBox h5{margin:0;padding:0 0 15px;font-size:18px;font-weight:700}
.specificatiesBox h3{margin:0;padding:0 0 15px;font-size:16px;font-weight:400}
.specificatiesBox ul{list-style:none;clear:both}
.specificatiesBox li{padding:5px 0 5px 23px;font-size: 14px;color:#fff;border-bottom:1px solid #ddd;overflow:hidden}
.specificatiesBox li span{width:190px;float:left}
.specificatiesBox p{width:100%;float:left;font-size: 14px; }
.specificatiesBox a.link{position:relative;margin:0;padding-right:15px;display:inline-block;font-size: 14px;color:#fff;text-decoration:underline}
.specificatiesBox a.link:after { position: absolute; right: 0px; top: -4px; font-family: 'FontAwesome'; content: "\f105"; font-size: 20px; }
.specificatiesBox .specificationTitle, .specificatiesBox .data-table tr { display: none; }
.specificatiesBox.specifications { margin-top: 0; padding: 20px; }
.specificatiesBox.specifications .data-table tr, .specificatiesBox .data-table tr:nth-child(1), .specificatiesBox .data-table tr:nth-child(2), .specificatiesBox .data-table tr:nth-child(3), .specificatiesBox .data-table tr:nth-child(4), .specificatiesBox .data-table tr:nth-child(5) { display: table-row; }
.specificatiesBox .data-table { color: #333333; margin-bottom: 10px; }
.specificatiesBox .data-table tr.last th, .data-table tr.last td, .specificatiesBox .data-table tbody th, .data-table tbody td { border-bottom: 1px solid #ddd; }
.specificatiesBox .data-table th { padding: 8px 8px 8px 23px; font-weight: 500; }
.scroller { position: fixed; top: 0; left: 0; width: 100%; overflow: auto; height: 100%; padding-top: 100px; }
.bg { width:100%; height:10px; background:#fff; }
.bg .upsBox{border:0;float:right;width:auto;padding:0; }
.bg .upsBox li{padding:20px 30px 20px 20px}
@media only screen and (max-width: 1120px) {
    .bg .upsBox { display: none; }
}
.action { background: #f2f7fc; padding-top: 10px; padding-bottom: 10px; margin-bottom: 20px; }
.action>div:before,.action>div:after { display:none; }
.action h4 { font-weight: 900;padding-right:1.25rem;font-size:1.125rem;margin:0; color: #111; }
.action a { font-weight: 900;padding-right:50px;font-size: 14px;border:1px solid #fff; border-radius: 25px; }
.action>div { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }
@media only screen and (max-width: 1024px) {
    .action>div { display: block; text-align: center; }
    .action h4 { padding-right: 0; padding-bottom: 1.25rem; padding-left: 0; }
}
@media only screen and (max-width: 767px) {
    .action { padding-top: 1.875rem; padding-bottom: 1.875rem; }
    .action .btn-default:hover { background: #fff; border-color: #fff; }
}
.latest { padding-top: 1.875rem; }
.latest ul { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.latest ul li { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-self: stretch; -ms-flex-item-align: stretch; align-self: stretch; margin-bottom: 1.875rem; }
.latest__block, .expertise__block { width: 100%; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; position: relative; padding-right: 0.9375rem; padding-left: 1.875rem; transition: 0.3s ease-in-out; border: 1px solid #ddd; background-position: center bottom; background-repeat: no-repeat; background-size: cover; }
.latest__block:hover, .expertise__block:hover { background: #0e0e0e; }
.latest__block a { width: 100%; height: 100%; display: block; overflow: hidden; top: 0; left: 0; font-weight: 800; }
.latest__block .btn-default { color: #fff; border-color: #f60; background-color: #f60; border-radius: 25px; transition: all ease-in-out 300ms; }
.latest__block .btn-default:hover { opacity:0.8; transition: all ease-in-out 300ms; }
.expertise__block a { width: 100%; height: 100%; display: block; overflow: hidden; text-indent: -9999px; position: absolute; top: 0; left: 0; font-weight: 800; }
.expertise__block img.rechts { float: right; margin-right: -14px; }
.latest__block h3, .expertise__block h3 { line-height: 1.3; font-weight: 800; text-transform: uppercase; font-size: 1.3125rem; }
.latest__block h4, .expertise__block h4 { font-weight: 800; text-transform: uppercase; color: #f60; margin-bottom: 0.4375rem; font-size: 18px; }
.latest__block h4 strong, .expertise__block h4 strong { color: #fff; }
.latest__block figure, .expertise__block figure { -webkit-align-self: center; -ms-flex-item-alifgn: center; -ms-grid-row-align: center; align-self: center; margin-top: -0.625rem; margin-right: -1.25rem; margin-bottom: -1.5625rem; }
.latest__block > div, .expertise__block > div { -ms-flex-item-align: end; align-self: flex-end; padding-bottom: 54px; }
.latest__block > div img, .expertise__block > div img { max-width: inherit; margin-top: 0.625rem; margin-right: -3.125rem; margin-bottom: 1.375rem; }
@media only screen and (max-width: 575px) {
    .latest__block h3, .expertise__block h3, .latest__block h4, .expertise__block h4 { font-size: 1rem; }
    .latest__block h3 br, .expertise__block h3 br { display: none; }
}
@media only screen and (max-width: 1199px) {
    .latest__block,.expertise__block { padding-right:.9375rem;padding-left:.9375rem; }
    .latest__block h3,.expertise__block h3 { font-size:1.1875rem; }
    .latest__block h4,.expertise__block h4 { font-size:1.125rem; }
    .latest__block > div img,.expertise__block > div img { max-width:110%;margin-top:.625rem;margin-right:-1.25rem;margin-bottom:1.375rem; }
}
.tabcontentBox { padding: 0px 0px 20px 0; }
.assemblyBox ul.nav.nav-tabs.action { position: absolute; right: 0px; top: 0px; margin: -1px; padding: 0; border: 0; }
.assemblyBox ul.nav.nav-tabs.action li { margin: 0; padding: 0; transition: all ease-in-out 300ms; -webkit-transition: height 1s ease-in-out; -moz-transition: height 1s ease-in-out; -ms-transition: height 1s ease-in-out; -o-transition: height 1s ease-in-out; transition: height 1s ease-in-out; }
.assemblyBox ul.nav.nav-tabs.action li a { width: 40px; height: 40px; margin: 0; padding: 0; text-align: center; font-size: 12px; line-height: 45px; color: #585858; border: 0; border: 1px solid #ddd; border-bottom: 1px solid #ddd; float: left; text-decoration: none; border-radius: 0; background-color: #111; transition: all ease-in-out 300ms; -webkit-transition: height 1s ease-in-out; -moz-transition: height 1s ease-in-out; -ms-transition: height 1s ease-in-out; -o-transition: height 1s ease-in-out; transition: height 1s ease-in-out; }
.assemblyBox ul.list li.active-product-set, .assemblyBox ul.list li.active, .assemblyBox ul.list li:hover { transition: all ease-in-out 300ms; -webkit-transition: height 1s ease-in-out; -moz-transition: height 1s ease-in-out; -ms-transition: height 1s ease-in-out; -o-transition: height 1s ease-in-out; transition: height 1s ease-in-out; }
.assemblyBox ul.nav.nav-tabs.action li:hover a { color: #111; background-color: #111; transition: all ease-in-out 300ms; }
.assemblyBox ul.nav.nav-tabs.action li.active a { color: #111; background-color: #ddd; transition: all ease-in-out 300ms; }
.assemblyBox .tiles .block { position: relative; margin: 0 4% 4% 0; display: inline-block; width: 30%; border: 1px solid #ddd; transition: all ease-in-out 100ms; }
.assemblyBox .tiles .block:nth-child(3n) { margin: 0 0 4% 0; transition: all ease-in-out 100ms; }
.assemblyBox .tiles .block:hover, .tabcontentBox .block.active { cursor: pointer; border: 1px solid #474747; transition: all ease-in-out 100ms; }
.assemblyBox .tiles .block .subtitle { position: relative; overflow: hidden; padding: 10px 17px; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; color: #111; border-bottom: 1px solid #ddd; }
.assemblyBox .tiles .block:hover .subtitle, .assemblyBox .block.active .subtitle { padding: 10px 17px; color: #111; }
.assemblyBox .tiles .block.disabled .subtitle { color: #b9b9b9; }
.assemblyBox .tiles .block .info { float: right; margin-left: 5px; font-size: 16px; color: #888888; text-decoration: none; margin-top: 2px; }
.assemblyBox .tiles .block .info:hover, .assemblyBox .tiles .block .info:focus { color: #111; }
.assemblyBox .tiles .block img { display: block; width: 100%; max-width: 120px; height: auto; margin: 20px auto 60px auto; }
.assemblyBox .tiles .block.disabled img { -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.5; }
.assemblyBox .tiles .block .label { position: absolute; bottom: 0; left: 0; margin: 22px 25px; line-height: 13px; }
.assemblyBox .tiles .block .part-label{ position:absolute;bottom:0;left:0;height:24px;font-size: 14px;color:#333;text-align:center;text-decoration:none;border:1px solid #ddd;border-radius: 2px; margin:11px 12px;padding:0 15px; }
.assemblyBox .tiles .block .price{ position:absolute;bottom:0;right:0;font-size: 14px;line-height:24px;color:#111;float:right;margin:10px; }
.assemblyBox { width: 100%; overflow: hidden; margin-bottom: 20px; }
.assemblyBox p { font-size: 14px; line-height: 18px; margin: 5px 0px 0px 0px; color: #111; }
.assemblyBox .title { padding: 15px; position: relative; border: 1px solid #ddd; border-radius: 5px; }
.assemblyBox .tiles { margin-top: 20px; }
.assemblyBox .title h4 { margin: 0px; padding: 0px; font-size: 18px; color: #111; font-weight: 700; line-height: 24px; }
.assemblyBox .part-image-display { width: 170px; height: 170px; position: relative; border-radius: 5px; float: left; text-align: center; padding: 0; list-style: none; min-height: 170px; border: 1px solid #ddd; transition: 0.3s ease-in-out; }
.assemblyBox .part-image-display img { max-width: 100%; max-height: 100%; width: 73%; margin-top: 16%; display: block; margin-left: auto; margin-right: auto; transition: 0.3s ease-in-out; }
.assemblyBox .list .image { display: none; width: 170px; float: left; padding: 0px 12px 0px 0px; margin-top: 15px; transition: 0.3s ease-in-out; }
.assemblyBox .list .image.active { display: block; transition: 0.3s ease-in-out; }
.assemblyBox .part-image-select { clear: both; padding: 0; margin: 0; }
.assemblyBox .part-image-select li { margin: 0 6px 0 0; float: left; list-style: none; border-radius: 25px;}
.assemblyBox .part-image-select li a:hover, .assemblyBox .part-image-select li.active a { background: #fbfbfb; border: 1px solid #c6c6c6; border-radius: 25px;}
.assemblyBox .part-image-select li a { margin: 0;  padding: 0px; width: 13px; height: 13px; border: 1px solid #ddd; display: block; border-radius: 25px; }
.assemblyBox ul.list { list-style: none; padding: 12px; margin-top: 15px; border: 1px solid #ddd; border-bottom: none; width: 100%; overflow: hidden; margin-bottom: 0px; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px;  }
.assemblyBox ul.list li { border-radius: 3px; color: #fff; overflow: hidden; width: 100%; position: relative; min-height: 34px; transition: 0.3s; border: 1px solid #151515; border-left: 3px solid #151515; }
.assemblyBox .rightside { width: calc(100% - 197px); width: calc(100% - 197px); float: right; margin-bottom: 20px; }
.assemblyBox .rightside .short_description { float: left; clear: both; }
.assemblyBox ul.list li label { z-index: 1; }
.assemblyBox ul.list li span { display: inline; overflow: hidden; max-width: 100%; word-wrap: break-word; text-overflow: ellipsis;  white-space: nowrap; border-radius: 25px; line-height: 25px; }
.assemblyBox ul.list li span.product-set { color: #fff; font-size: 14px; font-weight: 900; }
.assemblyBox ul.list .produkt-set { font-weight: bold; }
.assemblyBox li.productset { border: none!important; padding-top: 2px; }
.assemblyBox ul.list li.active span { max-width: 92%; }
.assemblyBox ul.list li.active span.product-set { color:#3c3c3c; }
.assemblyBox ul.list li .info { position: absolute; top: 5px; right: 7px; border-radius: 25px; }
.assemblyBox ul.list li .icon { font-size: 14px; color: #585858; vertical-align: middle; margin-top: -2px; }
.assemblyBox ul.list li .icon:hover { color: #111; }
.assemblyBox ul.list li:hover .icon { color: #111; text-decoration: none; transition: 0.3s; }
.assemblyBox ul.list li .disabled { color: #b7b7b7; }
.assemblyBox ul.list li .info small { padding: 4px; font-size: 14px; color: #fff; border: 1px solid #ddd; border-radius: 6px; }
.assemblyBox ul.list li .info small i { font-size: 12px; color: #585858; }
.assemblyBox ul.list li:hover { border: 1px solid #151515; background: #0e0e0e; transition: all ease-in-out 100ms; border-left: 3px solid #0090e2; }
.assemblyBox ul.list li.active { border: 1px solid #ddd; border-left: 3px solid #0090e2; background: #f2f7fc; color: #111; }
.assemblyBox ul.list li.active span { color: #111; }
.assemblyBox .radio { margin-top: 0px; }
.assemblyBox .radio label,.assemblyBox .checkbox label { float:left;cursor:pointer;position:relative;font-size: 14px;color:#111;height:30px;padding-left:13px;padding-top:4px;width:96%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis; }
.assemblyBox .radio input[type="radio"] { display: none; }
.assemblyBox .list .active label { color: #111; }
.assemblyBox .radio label span { color: #cbcbcb; }
.radio label, .checkbox label { min-height: 20px; padding-left: 20px; margin-bottom: 0; font-weight: 400; cursor: pointer; line-height: 21px; }

/*.assemblyBox .radio label span:before { content: ""; display: inline-block; width: 16px; height: 16px; margin-right: 10px; position: absolute; bottom: 10px; }*/
.assemblyBox .radio label.disabled span { color: #b9b9b9; }
.assemblyBox .radio label.disabled span.label { color: #111; }
.assemblyBox .part-label { margin-right: 5px; padding-left: 8px; padding-right: 8px; border-radius: 0px; color: #e10817; border: 1px solid #e10817; font-size: 12px; border-radius: 2px; }
.assemblyBox .information { display:none;margin-top:0;background:#fff;border:1px solid #ddd;width:100%;overflow:hidden;padding:20px 21px 0 30px; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
.assemblyBox .information.active { display:block; }
.assemblyBox .information h4 { font-size:16px;color:#111;font-weight:700;margin-bottom:5px; float: left; }
.assemblyBox .information p { font-size: 14px;line-height:18px;margin-top:0;color:#111;padding:0; float: left; clear: both; }
.assemblyBox .information a { font-size: 14px;line-height:21px;padding-bottom:10px;color:#969696;text-decoration:none;margin-bottom:10px;clear:both;float:left;transition:.3s; }
.assemblyBox .information a:hover { color:#111; transition: 0.3s; }
.assemblyBox .information .part-label { display: none; }
.assemblyBox .faq-item { margin:0; }
.assemblyBox .faq-item h4 { margin-top: 10px; }
.assemblyBox .faq-item p { margin-bottom:0; }
.assemblyBox .faq-item li { position:relative;border:1px solid #ddd;margin-top:-1px;padding:19px 0 17px 15px; }
.noassembly { margin-top: 81px !important; text-align: center; width: 100%; opacity: 0.5; }

@media (max-width: 767px) {
    .assemblyBox ul.list li .info { top: 8px!important; }
    .assemblyBox .radio label span { max-width: 80%!important; display: inline; text-overflow: ellipsis; word-wrap: break-word; float: left; }
    .assemblyBox ul.list li, .assemblyBox ul.list li.active, .assemblyBox ul.list li.active-product-set { padding-left: 10px; }
    .assemblyBox ul.list li .icon { margin-right: 0px; }
    .assemblyBox .part-image-display { float:none;width:170px;height:170px;margin:0px; width: 100%; }
    .assemblyBox .part-image-display img { width:170px;max-width:100%;max-height:100%;margin-top:0;padding:20px; }
    .assemblyBox .title h4 { font-size:16px; }
    .assemblyBox .part-label { margin-right:-108px;margin-top:22px; }
    .assemblyBox .part-image-select { width:fit-content;height:24px;margin:10px auto; }
    .assemblyBox .list .image { width:100%; }
    .assembly-imageholder { width:fit-content;overflow:hidden;margin:0 auto 20px; width: 100%; }
    .assemblyBox .tiles .block { position: relative;  margin: 0 4% 4% 0; display: inline-block; width: 100%; border: 1px solid #ddd;  transition: all ease-in-out 100ms; }
    .assemblyBox .radio label { float: left; margin: 4px 0; padding: 1%; width: 92%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .assemblyBox .part-image-select li a { width: 20px; height: 20px; }
    .part-image { width:100%; }
    .assemblyBox ul.list li .part-label { display: none; }
    .assemblyBox .information .part-label { display: block; float: right; margin: 0px; width: 100%; text-align: center; margin: 5px 0px 10px 0px; border-radius: 25px; }
}
@media only screen and (max-width: 1024px) {
    .assemblyBox .radio label { width: 90%; }
}
@media only screen and (max-width: 1159px) {
    .gameComputerBox .btn.btn-primary {  margin: 0px 20px 0; }
}

.gameComputerBox .btn-spacer { height: 42px; }
.gameComputerBox .btn.btn-primary { position: absolute; bottom: 0; left: 0; width: calc(100% - 40px); margin: 20px; }
.gameComputerBox .featured-set .composeBox>ul>li { padding: 22px 20px 22px 20px; }
.gameBox { width: 100%; overflow: hidden; border: 1px solid #ddd; margin-bottom: 1.875rem; border-radius: 5px; }
.gameBox .property-value-dropdown { padding: 10px; }
.gameBox p.title { font-size: 16px; color: #111; font-weight: 700; border: 0; border-bottom: 1px solid #ddd; margin: 0; padding: 13px 23px; }
.gameBox p.title small { font-size: 14px; color: #111; font-weight: 500; border: 0; margin: 0;  padding: 0; display: block; }
.gameBox .image{ position:relative;height:120px;max-width:200px;width:100%;margin:15px auto; }

.gameBox .image .casing{ position:absolute;top:0;left:0;z-index:2;width:120px;height:120px; }
.gameBox .image .soundbar { position:absolute;top:0;right:-40px;z-index:1;width:120px;height:120px; }
.gameBox .image .casing.default, .gameBox .image .televizor.default { opacity: 0.5; }
.gameBox .image .assembly{ position:absolute;top:-15px;left:36px;z-index:2;width:149px;height:149px; }
.gameBox .image .img#kućišta { display: none; }
.img#kućišta { display: none; }

.gameBox .tabs { border-top:1px solid #ddd;border-bottom:1px solid #ddd; }
.gameBox .tabs ul { background:#111;overflow:hidden;width:100%;display:table; }
.gameBox .tabs li { display:table-cell;width:50%;font-weight: 900; }
.gameBox .performance { height: 337px; overflow-x: hidden; overflow-y: auto; }
.gameBox .tabs li a{padding:8px;height:40px;font-size: 14px;color:#969696;text-decoration:none;display:block;background:#111;border-right:1px solid #ddd;text-align:center;width:100%}
.gameBox .tabs li.r-tabs-state-active a{background:#ddd;border-bottom:2px solid #e10817;color:#111}
.gameBox .holder{width:100%;overflow:hidden;position:relative}
.gameBox .col{ width:25%;float:left;line-height:36px;text-align:center;font-size: 14px;color:#111;text-transform:uppercase;border:1px solid #ddd}
.gameBox .fill{ margin-bottom: 1px; overflow: hidden; height: 33px; padding: 0 0px; font-size: 12px; color: #111; position: relative; line-height: 35px!important; float: left; clear: both; width: 100%; }
.gameBox .status { position: absolute; top: 0px; bottom: 0px; left: 0; background: rgb(85, 0, 0); background: linear-gradient(90deg, rgb(88 0 6) 0%, rgb(225 7 23) 48%, rgb(225 7 23) 81%, rgb(225 7 23) 100%); padding: 0px 10px; line-height: 36px; height: 100%; display: block; white-space: nowrap; overflow: hidden; color: #fff; }
.gameBox .fill1, .gameBox .line1 { width: 25%; }
.gameBox .fill2, .gameBox .line2 { width: 50%; }
.gameBox .fill3, .gameBox .line3 { width: 75%; }
.gameBox .fill4, .gameBox .line4 { width: 100%; }
.gameBox .line { height: 100%; border-right: 1px solid #ddd; position: absolute; top: 0; left: 25%; }
.gameBox .list.r-tabs-panel {  overflow: hidden; padding: 0; border-bottom: 1px solid #ddd; }
.gameBox .list ul { list-style: none; height: 203px; overflow-x: hidden; overflow-y: auto; padding: 0; margin: 0; }
.gameBox .list li { display: block; cursor: pointer; border-bottom: 1px solid #ddd; color: #111 ; }
.gameBox .list li:hover { color: #111; }
.gameBox .list li a { display: none; padding: 5px 0px 5px 50px; height: 40px; position: relative; width: 100%; font-size: 14px; color: #111; background: url(/game_computer_store/img/hardwaresprite.png) no-repeat; background-position: 0px 48px; line-height: 28px; border-left: 2px solid transparent; border-bottom: 1px solid #ddd; overflow: hidden; transition: 0.3s ease-in-out; }
.gameBox .list li a:hover { background: url(/game_computer_store/img/hardwaresprite-hover.png) no-repeat; color: #111; }
.gameBox .list li a.active { display: block; color: #111; }
.gameBox .list li:hover a, .gameBox .list li.active a { border-left: 2px solid #e10817; text-decoration: none; color: #111; }
.gameBox .list li:hover a, .gameBox .list li.active a { background-color: #0e0e0e; color: #111; }
.gameBox .list li a.part__rasvjete, .gameBox .list li a.part__rasvjete { background-position: 0 -5px !important; }
.gameBox .list li a.part__graficka_kartica { background-position: 0 -53px !important; }
.gameBox .list li a.part__extra_graficka_kartica { background-position: 0 -53px !important; }
.gameBox .list li a.part__citaci_memorijskih_kartica { background-position: 0 -1252px !important; }
.gameBox .list li a.part__internet_aansluitingen { background-position: 0 -869px !important; }
.gameBox .list li a.part__processor_hladenje { background-position: 0 -677px !important; }
.gameBox .list li a.part__windows_10 { background-position: 0 -293px !important; }
.gameBox .list li a.part__office_paketi { background-position: 0 -917px !important; }
.gameBox .list li a.part__garancija { background-position: 0 -485px !important; }
.gameBox .list li a.part__memorija { background-position: 0 -533px !important; }
.gameBox .list li a.part__periferija{ background-position: 0 -437px !important; }
.gameBox .list li a.part__l_e_d_rasvjete, .gameBox .list li a.part__extra_l_e_d_rasvjete { background-position: 0 -5px !important; }
.gameBox .list li a.part__videokaart, .gameBox .list li a.part__2e_videokaart, .gameBox .list li a.part__2e_grafische_kaart, .gameBox .list li a.part__grafische_kaart { background-position: 0 -53px !important; }
.gameBox .list li a.part__optische_kaart { background-position: 0 -101px !important; }
.gameBox .list li a.part__headset { background-position: 0 -149px !important; }
.gameBox .list li a.part__korting, .gameBox .list li a.part__aanbieding, .gameBox .list li a.part__deal { background-position: 0 -197px !important; }
.gameBox .list li a.part__kucista { background-position: 0 -245px !important; }
.gameBox .list li a.part__operativni_sistem, .gameBox .list li a.part__windows { background-position: 0 -293px !important; }
.gameBox .list li a.part__anti_virus_i_internet_security, .gameBox .list li a.part__security { background-position: 0 -341px !important; }
.gameBox .list li a.part__gameplay_capture_card, .gameBox .list li a.part__game_capture_card { background-position: 0 -389px !important; }
.gameBox .list li a.part__accessoires, .gameBox .list li a.part__muis { background-position: 0 -437px !important; }
.gameBox .list li a.part__garancija { background-position: 0 -485px !important; }
.gameBox .list li a.part__memorija { background-position: 0 -533px !important; }
.gameBox .list li a.part__zvucna_kartica { background-position: 0 -581px !important; }
.gameBox .list li a.part__speakers, .gameBox .list li a.part__los { background-position: 0 -629px !important; }
.gameBox .list li a.part__hladenje { background-position: 0 -677px !important; }
.gameBox .list li a.part__u_s_b_memorija { background-position: 0 -725px !important; }
.gameBox .list li a.part__maticna_ploca { background-position: 0 -773px !important; }
.gameBox .list li a.part__monitor { background-position: 0 -821px !important; }
.gameBox .list li a.part__mrezna_oprema, .gameBox .list li a.part__wi_fi, .gameBox .list li a.part__wi-fi { background-position: 0 -869px !important; }
.gameBox .list li a.part__office_pakket, .gameBox .list li a.part__office { background-position: 0 -917px !important; }
.gameBox .list li a.part__overclocking, .gameBox .list li a.part__p_c_tuning, .gameBox .list li a.part__tuning { background-position: 0 -965px !important; }
.gameBox .list li a.part__processor, .gameBox .list li a.part__cpu { background-position: 0 -1013px !important; }
.gameBox .list li a.part__napajanja { background-position: 0 -1061px !important; }
.gameBox .list li a.part__toetsenbord { background-position: 0 -1109px !important; }
.gameBox .list li a.part__disk, .gameBox .list li a.part__extra_disk, .gameBox .list li a.part__disk, .gameBox .list li a.part__extra_disk, .gameBox .list li a.part__hdd { background-position: 0 -1157px !important; }
.gameBox .list li a.part__opticki_uredaji { background-position: 0 -101px !important; }
.gameBox .list li a.part__ssd { background-position: 0 -1205px !important; }
.gameBox .list li a.part__cardreader { background-position: 0 -1252px !important; }
.gameBox .list li a.part__beeldscherm { background-position: 0 -1299px !important; }
.gameBox .list li a.part__wi_fi_amp_bluetooth { background-position: 0 -1346px !important; }
.gameBox .list li a.part__games { background-position: 0 -1438px !important; }
.gameBox .list li a.part__gaming_slusalice { background-position: 0 -1490px !important; }
.gameBox .list li a.part__gaming_tastature { background-position: 0 -1542px !important; }
.gameBox .list li a.part__gaming_misevi { background-position: 0 -1597px !important; }
.gameBox .list li a.part__poklon { background-position: 0px -195px !important; }
.gameBox .list li a.part__termalna_pasta { background: url(/game_computer_store/img/pasta-standard.png) no-repeat; background-position: 10px 4px !important; }
.gameBox .list li a.part__termalna_pasta:hover { background: url(/game_computer_store/img/pasta-hover.png) no-repeat; }
.gameBox .total { padding: 13px; overflow: hidden; border-bottom: 1px solid #ddd; }
.gameBox .total p { font-size: 18px; color: #111; font-weight: 900; }
.gameBox .total .configure-btn { font-size: 14px; border-radius:5px; }
.gameBox .total .configure-btn a:after { background-image: url(/game_computer_store/img/angle-right-red.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.gameBox .total .configure-btn:after { background-image: url(/game_computer_store/img/angle-right-red.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.gameBox .total .configure-btn i.fa.fa-spinner.fa-spin.mr-2, .gamedetailBox .order .btn i.fa.fa-spinner.fa-spin.mr-2 { margin-right: 5px;}
.gameBox .total span { float: right; font-size: 18px; font-weight: 900; text-transform: uppercase; }
.gameBox ul.tab { list-style: none; padding: 0;  margin: 0; }
.gameBox ul.tab li { width: 100%; float: left; text-align: center; transition: all 200ms; }
.gameBox ul.tab li a { display: block; width: 100%; padding: 12px 0px 12px 2px; font-family: "DM Sans", sans-serif; font-size: 14px; color: #111; text-decoration: none; }
.gameBox ul.tab li.first { border-right: 1px solid #ddd; }
.gameBox ul.tab li:hover, .gameBox ul.tab li.active { background-color: #ddd; color: #fff; }
.gameBox ul.tab li img { float: left; max-width: 25px; margin-left: 80px;  margin-right: -70px; }
.gameBox .total .rate-pay { margin-bottom:15px; }
.gameBox .total .rate-pay p { font-size: 14px;color:#333;text-align:right;font-weight:400;margin:0 0 5px; }
.gameBox .total .rate-pay-banner { width:100%;min-height:20px; }

@media only screen and (max-width: 476px) {
    .gameBox ul.tab li img { margin-left: 40px; }
    .gameBox .list ul { height: 500px; }
    
}

@media only screen and (max-width: 1024px) {
    .gameBox .configure-btn {  font-size: 14px; }
}
@media only screen and (max-width: 1234px) {
    .gameBox .configure-btn { padding-left: 0; padding-right: 0; text-align: center; }
}
.rate-pay { margin-top:5px;background:#fff;border-radius:25px;padding:5px 15px; font-size: 12px; border: 1px solid #ddd; color:#111; font-weight: normal; }
.rate-pay .banner { width:100%;max-width:190px;padding:10px; }
.rate-pay p { font-size: 14px;color:#fff;margin:0 0 5px; }
.rate-pay a { font-size: 14px;color:#fff;text-decoration:none; }
.rate-pay a:hover { font-size: 14px;color:#fff;text-decoration:underline; }
.rate-pay img,.rate-pay-banner{max-width:100%;object-fit:contain;border:1px solid #9c9c9c;background:#fff;min-height:38px;padding:10px 0; }

.performance { --scrollbarBG: #111; --thumbBG: #585858; }
.performance::-webkit-scrollbar { width: 14px; }
.performance { scrollbar-width: thin; scrollbar-color: #111; }
.performance::-webkit-scrollbar-track { background: #111; }
.performance::-webkit-scrollbar-thumb { background-color: #585858; border-radius: 6px; border: 3px solid #111; }

.facebook-liken, .facebook-like { float: right; }
.facebook-like a { border-radius: 3px; }
.facebook-like a:hover { text-decoration: none; }
.facebook-like .loginBtn { box-sizing: border-box; position: relative; margin: 0px; padding: 0 13px 0 13px; text-align: left; line-height: 26px; white-space: nowrap; font-size: 14px; color: #fff; border-radius: 3px; float: right; }
.facebook-like .loginBtn:before { content: ""; box-sizing: border-box; position: absolute; top: 0; left: 0; width: 34px; height: 100%; }
.facebook-like .loginBtn:focus { outline: none; }
.facebook-like .loginBtn:active { box-shadow: inset 0 0 0 32px rgba(0, 0, 0, 0.1); }
.facebook-like .facebook-button { text-decoration: none; color: #fff; border-radius: 4px; }
.facebook-like .loginBtn--facebook { background-color: #1877f2; text-shadow: 0 -1px 0 #354C8C; }
.facebook-like .loginBtn--facebook:hover, .loginBtn--facebook:focus { background-color: #1f81ff; color:#fff; }

.liken { margin-right: 5px; }

.customersupportBox { margin-top:8px;width:100%;overflow:hidden;border:1px solid #ddd ;padding:10px 20px; }
.customersupportBox p { font-size: 14px;padding:0 0 10px; }
.customersupportBox .subtitle { font-size:18px;color:#111;font-weight:700;line-height:22px;border:none; }
.customersupportBox .call2 { font-size:16px;color:#111;padding:0 0 10px 38px; }
.product-header { width:100%; background:#fff; padding:0px; }
.product-header .selectdiv{ position:relative;float:left;min-width:420px;display:block;height:47px;border:1px solid #ddd;background-image:url(/game_computer_store/img/select-arrow-basket.png);background-position:right;background-repeat:no-repeat;margin-top:10px; }
.product-header .selectdiv:hover { background-image:url(/game_computer_store/img/select-arrow-basket.png);background-position:right;background-repeat:no-repeat; }
.product-header .selectdiv label { width:70px;line-height:40px;font-size: 14px;color:#111;display:inline-block;padding:0 0 0 10px; }
.product-header .select { position: relative; width: calc(100% - 70px); width: calc(100% - 70px); float: right; height: 40px; display: inline-block; }
.product-header .select select { width: 100%; padding: 0 10px; height: 42px; font-size: 14px; color: #b9e3ff; margin: 0; border: none; outline: none; display: inline-block; cursor: pointer; background: none; -webkit-appearance: none; -moz-appearance: none; }
.product-header .select:after { position:absolute;top:0;right:0;pointer-events:none; }
.product-header ul { list-style:none;border:0;margin:0; }
.product-header li { float:left;padding:10px 0 0 10px; }
.product-header li.sticky-header-button .fa { font-size:22px; }
.product-header li.sticky-header-button a { height:47px;width:47px;line-height:50px;text-align:center;display:block;border:1px solid #ddd;color:#111; }
.product-header li.sticky-header-button a:hover { color:#111;background:#ddd; }
.product-header ul li.dropdown button span.content-text { color:#111;width:100%;line-height:18px; }
.product-header li img { margin: 10px; padding-top: 1px; }
.product-header .price { font-size: 14px;color:#111;line-height:38px;border:1px solid #ddd;min-width:240px;height:47px;padding:5px 10px; }
.product-header .title2 { width: auto; }
.product-header .total { float: right; }
.product-header .total p { padding: 8px 5px 0px 0px; font-size: 18px; color: #111; margin: 0px; }
.product-header .total strong { padding: 7px 5px 0px 0px; color: #111; font-size: 22px; display: block; }
.product-header .btn { padding-right: 1.875rem; padding-left: 0.9375rem; border-radius: 25px; margin-bottom: 10px; }
.product-header .btn-success { background: #29cb85; }
.product-header .pull-right { float: right; width: 280px !important; }
.product-header ul.dropdown-menu { background-color: #111; padding: 0; left: -1px;  top: 47px; }
.product-header ul.dropdown-menu li { margin: 0; padding: 0; width: 100%; border-bottom: 1px solid #474747; text-align: left; }
.product-header ul.dropdown-menu li a { border: 0px; width: 100%; border-left: 1px solid #000000; }
.product-header ul.dropdown-menu li a:hover { background-color: #111; border-left: 1px solid #0090e2; }
.product-header .select-top { margin: 0; padding: 0; margin-top: 0px; color: #111; font-size: 14px; height: 16px; font-weight: bold; text-transform: none; }
.product-header .select-bottom { margin: 0; padding: 0; color: #111; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-size: 11px; font-weight: normal; height: 18px; text-transform: none; }
.product-header.stickytwo { display: none; box-shadow-bottom: 0px 2px 4px #d7d7d7; -moz-box-shadow: 0px 2px 4px #d7d7d7; -webkit-box-shadow: 0px 2px 4px #d7d7d7; border: 0; }
.scrolled .product-header.stickytwo { display: block !important;  position: fixed; left: 0px; top: 81px; width: 100%; background: #f1f9ff;  z-index: 1010;  padding: 5px; }
.product-header.stickytwo a.samenstellen { padding: 0px 34px; height: 44px; line-height: 44px; vertical-align: middle; display: inline-block; font-size: 19px; color: #111; text-decoration: none; -webkit-border-radius: 2px; border-radius: 2px; background: #29cb85; }
.product-header.stickytwo a.samenstellen:hover { text-decoration: none; background: #95d742; transition: background .1s linear; }
.product-header.stickytwo a.samenstellen i { font-size: 19px; color: #fff;nmargin-right: 10px; margin-left: -10px; }
.product-header.stickytwo h4 { padding: 0px; font-weight: normal; font-size: 22px; color: #004572; }
.product-header.infostickyBox .left { float: left; }
.product-header.infostickyBox .right { float: right; }

@media only screen and (max-width: 476px) {
    .product-header-mobile { padding: 10px 0px 10px 0px; display: block; background-color: #111; }
    .product-header { padding:0px!important; }
    .product-header .btn-success { width: auto; padding: 11px 13px; }
    .container-mobile { margin-top: 100px!important; }
    .product-header li img { margin: 1px; }
}
@media only screen and (min-width: 768px) {
    .product-header { padding:0px!important; }
    .product-header-mobile, .mobile-usp { display: none; }
}
@media only screen and (max-width: 767px) {
    .product-header .priceli { float: right; }
    .product-header ul { padding: 0; }
    .product-header.stickytwo { display: none; }
    .scrolled .product-header.stickytwo { top: 0px; }
}
@media only screen and (max-width: 1024px) {
    .product-header .pull-right { float: right; width: 100% !important; }
}
.selectdiv .dropdown { width: 100%; padding: 0; }
.selectdiv .btn:focus, .selectdiv .btn:hover { outline: none; text-decoration: none; }
.selectdiv .dropdown .btn { width: 100%; padding: 0 0 0 10px; text-align: left; }
.selectdiv .dropdown-menu { border-radius: 0; width: 100%; max-height: 320px; overflow-y: scroll; }
.selectdiv .dropdown-menu>li>a { padding: 3px 10px; }
.selectdiv .dropdown-menu>li.active>a { background: #0e0e0e; }
.selectdiv .navbar-collapse, .selectdiv .nav.navbar-nav { width: 100%; padding: 0; }
.selectdiv .arrow{ position:absolute;right:0;top:0;height:40px;width:26px;cursor:pointer;z-index:99;font-size:0; }
.infostickyBox h4 { color:#111; }
.is-sticky .product-header { display:block; }
.is-sticky .sticky-header { z-index:9!important; margin-bottom: 10px; }
.is-sticky .sticky-header .btn-sticky { margin-top:6px;display:block; }
.information { padding-bottom:0; }
.product-header,.sticky-header .btn-sticky { display:none; }


@media only screen and (min-width: 768px) {
    a.header__logo { width: 175px; }
}

.navbar-nav li {
  font-size: 14px;
  text-transform: uppercase;
  font-weight: bold;
}

.navbar-nav li:hover,
.navbar-nav a:hover {
  background: none !important;
  font-weight: bold;
}

.navbar-nav > li:first-child {
  position: relative;
  padding-left: 30px; /* space for the hamburger icon */
  color:#fff;
}

.navbar-nav > li > .dropdown-menu {
    margin-left: 0px;
}

.navbar-nav > li:first-child::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 11px;
  background-image: linear-gradient(
    to bottom,
    #ffffff 2px,
    transparent 2px,
    transparent 5px,
    #ffffff 5px,
    #ffffff 7px,
    transparent 7px,
    transparent 10px,
    #ffffff 10px,
    #ffffff 12px
  );
  background-size: 100% 100%;
  background-repeat: no-repeat;
}



.information p { line-height:26px;font-weight: 500;margin-bottom:10px;font-size:16px; }
.information h1 { font-weight:700;text-transform:none;margin-bottom:.1875rem;font-size:30px; }
.information h2 { font-weight:200;font-size:26px; }
.information span { background:#2b2b2b;color:#c9c9c9;margin:6px 0;padding:4px; }
.information__price { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;  border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding-top: 1rem; padding-bottom: 1rem;  margin-bottom: 0.8125rem; }
.information__price strong { line-height: 1.35; font-weight: 800; display: inline-block; vertical-align: middle; margin-right: 0.5rem; font-size: 1.75rem; }
.information__price small { line-height: 1.35; display: inline-block; vertical-align: middle; font-size: 1.25rem; }
.information__price p { font-family: "DM Sans", sans-serif; margin: 0; font-size: 14px; }
.information__price .btn { min-width: 18.125rem; }
.information__rating { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }
.information__rating .rating a { line-height: 18px; }
.information__rating ol { display: inline-block; vertical-align: middle; }
.information__rating p { margin-top: 0.375rem; margin-bottom: 0;  font-size: 14px; }
.information__rating .btn-default { color: #f60; }
.information__rating .btn-default.btn-md { padding-right: 1.75rem; padding-left: 1.75rem; font-size: 1rem; }
.information__review { display: inline-block; vertical-align: middle; margin-left: 0.625rem; }
.information__review span { text-decoration: underline; }
.information__rating .aantal-besteld, .information__rating .aantal-besteld p { font-size: 14px; }
.information__rating .aantal-besteld strong { color: #fff; }
@media only screen and (max-width: 479px) {
    .information h1 { font-size:2.5625rem; }
    .information__price,.information__rating { display:block; }
}
@media only screen and (max-width: 1024px) {
    .information h1 { font-size:2.875rem; }
    .information img { margin:20px auto 1.25rem; }
    .information__price { display:flex; }
    .information__price .btn{min-width:0; }
    .information__rating { display: -webkit-flex; display: -ms-flexbox;  display: flex; }
}
@media only screen and (max-width: 1199px) {
    .information { padding-bottom:1.25rem; }
    .information__price,.information__rating { display:block; }
    .information__price>div,.information__rating>div { margin-bottom:.625rem; }
}
.kb-box { background: #fff; padding: 10px 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: 1px solid #ddd; *zoom: 1; margin-bottom: 10px; }
.kb-box:before,.kb-box:after { display:table;content:"";line-height:0; }
.kb-box:after { clear:both; }
.kb-s-form input { font-size: 14px;color:#fff;border:1px solid #ddd;background:#111;padding:0; }
.kb-s-form button { display: block; padding: 0 20px; font-size: 16px; text-align: center; white-space: nowrap; border-radius: 3px !important; line-height: 40px; border: none; float: right; }
div.kb-s-form { padding: 10px 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: 1px solid #ddd; margin: 0 15px 15px 15px; }
div.kb-s-form:before,div.kb-s-form:after { display:table;content:"";line-height:0; }
div.kb-s-form:after { clear:both; }
div.kb-s-form .input-text { width:99%;padding:9px 10px; }
div.kb-s-form h4 { font-size:18px;margin-bottom:10px; }
div.kb-category-view { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin: 0 15px 15px 15px; }
div.kb-category-view h1 { margin-bottom:10px;font-size:22px;font-weight:400;padding:0; }
div.kb-category-view:before,div.kb-category-view:after { display:table;content:"";line-height:0; }
div.kb-category-view:after { clear:both; }
div.kb-category-view .kb-category-view-subcategory { width:48%;float:left;margin:5px 0; }
div.kb-category-view .kb-category-view-subcategory .category-name { padding-bottom:3px;margin-bottom:3px;font-weight:700; }
div.kb-category-view .kb-category-view-subcategory .category-name a { color:#fff;text-decoration:none;font-size:18px; }
div.kb-category-view .kb-category-view-subcategory .category-name a:hover { text-decoration:none; }
div.kb-category-view .kb-category-view-subcategory .category-name a .num { color:#999;font-weight:400; }
div.kb-category-view .kb-category-view-subcategory .category-name a .more { color:#282828; }
div.kb-category-view .kb-category-view-subcategory .category-name a:hover .more { color:#eee; }
div.kb-category-view .kb-category-view-subcategory .articles{line-height:23px; }
div.kb-category-view .kb-category-view-subcategory .articles .article { margin:5px 0; }
div.kb-category-view .kb-category-view-subcategory .articles .article a { color:#111;text-decoration:none;font-size: 14px; }
div.kb-category-view .kb-category-view-subcategory .articles .article a:hover { text-decoration:underline;color:#e80322; }
div.kb-article-view { padding: 10px 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin: 0 10px 10px 10px; font-size: 14px; line-height: 25px; }
div.article-item { padding: 10px; border: 1px solid #ddd; background: #111; }
div.article-item p { color:#111;line-height:25px; }
div.article-item>.name { font-size: 14px;font-weight:700;text-decoration:none;padding-bottom:5px; }
div.kb-article-list p { font-size: 14px;line-height:21px;color:#111;padding:0; }
.kb-article-view { padding: 10px 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px;  border-radius: 5px; margin: 0 10px 10px 10px; font-size: 14px; line-height: 25px; }
.article-item { border:1px solid #ddd;background:#111;margin-bottom:10px;padding:10px; }
.article-item p { color:#111;line-height:25px; }
.article-item>.name { font-size: 14px;font-weight:700;text-decoration:none;padding-bottom:5px; }
.kb-article-list p { font-size: 14px;line-height:25px;color:#111;padding:0 0 20px; }
.itemBox { overflow:hidden;position:relative;padding:15px 15px 13px; }
.itemBox h3 { font-size:21px;font-weight:700;margin-bottom:8px; }
.itemBox h4 { font-size: 14px;font-weight:400;margin-bottom:15px; }
.itemBox .text { float:left;width:100%; }
.itemBox .content { border:1px solid #ddd;background:#111;position:relative;padding:1.625rem; }
.itemBox .content p { font-size: 14px;line-height:24px;color:#111;padding:0; }
.itemBox .content p:last-child { color:#111;margin:0; }
.itemBox .content a { color:#eb1d24;text-decoration:underline; }
.itemBox .content p a:hover { color:#e80322;text-decoration:none; }
.itemBox .content .icon{ position:absolute;top:13px;left:-1px; }
.itemBox .photo { width:35%;float:right; }
.itemBox .photo img { margin-bottom:-15px; }
.itemBox .left { float:left; }
.left .itemBox .photo.right { float:right;width:auto!important;display:inline-block;border:none!important;margin-top:24px;padding:0!important; }
.sticky-pc-info .title { font-size:18px;color:#fff;font-weight:700;float:left;width:290px;line-height:40px; }
.sticky-pc-info .upsBox { float:left;width:auto;display:inline-block;padding:11px 20px 0 10px; }
.sticky-pc-info .upsBox li { color:#fff;padding:0 30px 0 20px; }
.mobile-search{ position:absolute;top:0;left:0;background:#ddd;width:100%;padding:20px; }
.mobile-search .search .btn-search { display:none; }
.mobile-search .search,.mobile-search .search .input-group { width:100%; }
.mobile-search .search input { border: none; width: 100%; background: transparent; border-radius: 0; color: #efefef; box-shadow: none; }
.mobile_search .btn { opacity: 1; border-radius: 2px; width: 70px; line-height: 39px; float: right; font-size: 14px; color: #fff; text-decoration: none; border: none; text-align: center; height: 39px; background: #ddd; transition: background .1s linear; margin: 16px 16px 0px 0px; border: 1px solid #747474; border-radius: 3px; text-transform: none; }
.mobile_search .btn:hover { color:#fff;text-decoration:none;background:#666; }
.mobile-search .btn-close{ position:absolute;top:23px;right:23px;z-index:100; }
.specificationBox { margin-bottom: 50px; }
.specificationBox h4 { color:#0090e2; }
.home-link { margin: 30px 0px 30px 0px; }
.reviewform{ position:relative; }
.reviewform label { font-size: 14px;font-weight:400; }
.reviewform input { width: 70%; padding: 6px; background: #fff; border: 1px solid #ddd; font-size: 14px; line-height: 24px; font-style: normal; color: #111; border-radius: 5px; }
.reviewform textarea { width: 91%; padding: 10px; border: 1px solid #ddd; background: #fff; font-size: 14px; color: #111; line-height: 24px; border-radius: 5px; min-height: 200px; }
.reviewform .star-input { padding: 15px; border: 1px solid #ddd; border-radius: 5px; }
.reviewform .star-input .radio{display:inline-block}
.reviewform .star-input>label{width:100%;margin-bottom:0}
.reviewform .star-input .radio input{display:none}
.reviewform .star-input .radio label{width:23px;height:24px;min-height:auto;padding:0;top:4px;display:inline-block;text-indent:-9999px;background:url(/game_computer_store/img/star.png) left center}
.reviewform .star-input .radio label.on{background:url(/game_computer_store/img/active-star.png) left center}
.reviewsBox { width:100%; }
.reviewsBox .title { display:block;font-weight:400;font-size:22px;color:#e10817;padding:0 0 5px; }
.reviewsBox .stars { width:100%;font-size: 14px;color:#ddd;overflow:hidden;padding:10px 0; }
.reviewsBox .stars span { vertical-align:middle;display:block;padding:0 15px 0 0; }
.reviewsBox .stars.rightstars { width:auto;float:right; }
.reviewsBox .stars a { display:inline-block;vertical-align:middle;padding:0 1px 0 0; }
.reviewsBox ul { list-style:none;padding:0; }
.reviewsBox li { margin-bottom:20px;border:1px solid #e9e9e9;padding:15px; }
.reviewsBox li .title { float:left;display:block;font-weight:400;font-size:22px;color:#ddd;padding:0 0 10px; }
.reviewsBox li p strong { display:block;clear:both;color:#7c7c7c; }
.reviewsBox li p { font-size: 14px;color:#ddd;line-height:21px;margin-bottom:10px; }
.reviewsBox .stars.right { float:none;width:100%; }
.ratings_review ul { float:left;width:100%; }
.ratings_review ul li { border-bottom:1px solid #d8d8d8;margin-bottom:10px; }
.ratings_review ul li h3 { color:#7c7c7c;font-size:17px;font-weight:400;margin-bottom:3px; }
.ratings_review ul li span { color:#afb1b2;font-size:11px; }
.ratings_review ul li span strong { color:#7c7c7c;font-size:11px; }
.ratings_review ul li p { color:#000;font-size: 14px;margin-bottom:10px; }
.ratings_review h2,.review-header { font-weight:700;font-size:17px;color:#000;background:#f1f1f1;border-bottom:2px solid #c70717;border-top:1px solid #d8d8d8;margin:20px 0;padding:7px 13px; }
.box-reviews .title h2,.specificationTitle { padding-bottom:13px;font-size:17px;color:#333;font-weight:700;margin:20px 0 0; }
.box-reviews .reivew-header .rating-box,.box-reviews .reivew-header .rating-box .rating,#customer-reviews { margin-top:0; }
.box-reviews .reivew-header .review_title { float:left;width:100%;padding-bottom:3px; }
.box-reviews .reivew-header .review_addedby { width:100%;float:left; }
.box-reviews .reivew-header h5.nickName { font-weight:700;display:inline-block;padding-left:2px;margin:0; }
.box-reviews .reivew-header .reviewed_date { display:inline-block; }
.box-reviews .reivew-header { padding:0 0 10px; }
.box-reviews .reivew-sub-header { float:left;width:100%;padding:10px 0; }
.box-reviews .reivew-header .rating-box,.box-reviews .reivew-header .rating-box .rating,#customer-reviews { margin-top:0; }
.box-reviews .reivew-header .review_title { float:left;width:100%;padding-bottom:3px; }
.box-reviews .reivew-header .review_addedby { width:100%;float:left; }
.box-reviews .reivew-header h5.nickName { font-weight:700;display:inline-block;padding-left:2px;margin:0; }
.box-reviews .reivew-header .reviewed_date { display:inline-block; }
.reviewsBox li .title { float:left;display:block;font-weight:400;font-size:22px;color:#c70717; }
.reviewsBox .stars.rightstars { width:auto;float:right; }
.dynamicreview { overflow:hidden;width:100%;position:relative;margin-bottom:50px; }
.dynamicreview .title { display:block;font-weight:400;font-size:22px;color:#c70717;padding:0; }
.dynamicreview .title span { float:right;padding:7px 10px 0 0; }
.dynamicreview h2 { display:block;font-size:22px;color:#c70717;padding-top:10px; }
.paymentBox .data .select-promo-product { display:block;text-align:center;font-size: 14px;padding:10px; }
.paymentBox .data .select-promo-product a { text-transform:uppercase;border-bottom:1px dashed; }
.paymentBox .data .select-promo-product a:hover,.paymentBox .data .select-promo-product a:focus{text-decoration:none; }
.paymentBox .data .free-promo-product { color:#f60;font-size: 14px;font-weight: 900; }
.paymentBox .total .rate-pay { clear:both;float:right; }
.paymentBox .total .rate-pay p { font-size:12px;font-weight: 500;color:#878787;margin:0; }
.paymentBox .total .rate-pay a { font-size:12px;color:#878787;text-decoration:underline; }
.paymentBox .total .rate-pay-banner { width:241px;height:20px;margin-top:10px; }
@media only screen and (max-width: 767px) {
    .paymentBox td { display:block;width:100%; }
    .paymentBox .text { padding-top:10px;width:40%;float:left; }
}
.detail .page ul li { padding: 0 15px 12px 22px; width: 50%; float: left; }
.page ul li .block { padding: 0 0 10px 0; width: 100%; -webkit-border-radius: 2px; border-radius: 2px; min-height: 160px; }
.page ul li .block p { width:100%;float:none;font-size:12px; color:#eee; }
.page ul.list{list-style:none;padding:0 0 0 37px; }
.page ul.list li { width:100%;float:none;font-size: 14px;color:#eee;text-decoration:none;padding:3px 0; }
.page .subtitle{text-transform:uppercase;display:block;font-weight:400;font-size:22px;padding:20px 0 10px 37px; }
.page.page-action-page-pages-read h3 { font-weight:700;font-size:18px;margin:0;padding:0px 0px 10px 0px; }
.page.page-action-page-pages-read h3.title { font-family: "DM Sans", sans-serif;font-weight:700;font-size:16px;margin:0;padding:0 0 25px; }
.page.page-action-page-pages-read .addressBox .block span { font-size:16px;display:block;font-weight:400; }
.page.page-action-page-pages-read p { font-size: 14px;line-height:22px;color:#111;padding:0 0 5px; }
form.kontakt { background:#fff;overflow:hidden;color:#111;margin:20px 0;padding:35px 15px 85px 0; }
form.kontakt .form-control { width: 100%; padding: 0px; margin-bottom: 5px; background: #fff; font-size: 14px; color: #111; line-height: 24px; font-style: normal; border-radius: 5px; box-shadow: none; }
form.kontakt textarea { min-height:200px; }
form.kontakt .control-label { font-size: 14px;color:#111;line-height:24px;font-weight: 500;width:auto;padding:0 2px 3px 0; }
form .form-group label.required:after,form.kontakt .control-label.required:after { content:"*";font-style:normal;color:#eb340a;margin-left:5px; }
form.kontakt .col-md-4 { width:100%;padding-left:0;margin:0; }
form.kontakt .form-group { margin-bottom:15px;width:50%;float:left; }
form.kontakt .submit { clear:both; }
form.kontakt .submit .btn { display: block; height: auto; background: #29cb85; padding: 0 20px; font-size: 14px; text-align: center; white-space: nowrap; color: #fff; border-radius: 25px; line-height: 37px; border: 0px; text-transform: uppercase; padding: 5px 60px; }
form.kontakt .submit .btn:hover { text-decoration: none; background: #27ba7a; transition: background 0.1s linear 0s; }
.address-field { width: 100%; }
.btn-cancel, a.btn.btn-default.btn-cancel { font-size: 14px!important; }
.cart-title { padding-bottom:22px;font-family: "DM Sans", sans-serif;font-size:26px;font-weight:700;float:left;margin:0; }
.cart-title span { font-family: "DM Sans", sans-serif;font-size: 14px;font-weight:400;display:block;margin-top:5px; }
.cart-container { padding-bottom:1.125rem; }
.yourorderBox .free-promo-product { float:right;color:#00b200;font-size: 14px; }
ul.carts-promo-products{list-style:none;margin:0;padding:0; }
ul.carts-promo-products>li { float:none;width:280px;text-align:center;border:1px solid #f4f3f2;margin:0 auto 20px;padding:20px; }
ul.carts-promo-products>li:last-child { margin-bottom:0; }
ul.carts-promo-products>li>div { margin:0 0 20px; }
ul.carts-promo-products>li>div:last-child { margin:0; }
ul.carts-promo-products>li a.title { display:block;font-size:16px;font-weight:700;margin:0 0 20px; }
ul.carts-promo-products>li a.title:hover,ul.carts-promo-products>li a.title:focus { color:#e10817;text-decoration:none; }
ul.carts-promo-products>li .image { display:block;width:200px;margin:0 auto 20px; }
ul.carts-promo-products>li .image img { width:200px;height:200px; }
.secureBox,.thuiswinkelBox { width:100%;overflow:hidden;margin-bottom:18px;font-family: "DM Sans", sans-serif;font-weight:400;border:1px solid #f2f2f2;padding:20px 13px; }
.secureBox h3,.thuiswinkelBox h3 { font-size:18px;font-weight:700;margin:0; }
.secureBox p,.thuiswinkelBox p { font-size: 14px;line-height:20px;margin:0;padding:8px 0 20px; }
table.overBox { width:100%;border-collapse:collapse; }
table.overBox a { color:#333;text-decoration:underline; }
table.overBox a:hover { color:#e80322;text-decoration:none; }
table.overBox tr:nth-of-type(odd) { background:#fff; }
table.overBox th { background:#fff;font-weight:700; }
table.overBox td { width:50%;margin-top:10px;padding-top:20px!important; }
table.overBox td,th { text-align:left;line-height:26px;padding:0; }
#gameoptionCntr { width:100%;overflow:hidden; }
#gameoptionCntr #left { width:50%;float:left; margin-top: 39px; }
#gameoptionCntr #right { width:100%; }
#gameoptionCntr h1 { font-size: 24px; color: #fff; font-weight: 700; margin-bottom: 5px; }
#gameoptionCntr .content p { font-size: 14px; color: #333333; }
#gameoptionCntr .holder { padding: 20px; overflow: hidden; margin: 40px 0px 50px 0px; border: 1px solid #ddd; border-radius:5px; }
#gameoptionCntr .holder p { padding-bottom: 0px; margin-bottom: 0px; font-size: 14px; line-height: 18px; }
.margin50 { margin-top: 51px!important; }
form#ProductGoalCatalogAssembliesForm { margin-top: -20px; }

@media only screen and (max-width: 767px) {
    #gameoptionCntr #left { width: 100%; }
    #gameoptionCntr #right { width: 100%; padding: 20px 0px 0px 0px; }
    #gameoptionCntr .holder { margin: 86px 0px 20px 0px!important; }
}


#pag-block {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    gap: 10px;
}

#pag-block a {
    text-decoration: none;
    padding: 10px 15px;
    border-radius: 5px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    background-color: #007bff;
    transition: background-color 0.3s ease, transform 0.2s ease;
}

#pag-block a:hover {
    background-color: #0056b3;
    transform: scale(1.05);
}

#pag-block a.current {
    background-color: #28a745;
    cursor: default;
}

#pag-block a.disabled {
    background-color: #ccc;
    cursor: not-allowed;
    color: #666;
}

#pag-block a.next,
#pag-block a.prev {
    background-color: #6c757d;
}

#pag-block a.next:hover,
#pag-block a.prev:hover {
    background-color: #5a6268;
}

/* Hide the mobile image on desktop */
.desktop-img {
    display: block;
}

/* Hide the desktop image on mobile */
.mobile-img {
    display: none;
}

@media screen and (max-width: 767px) {
    /* Show the mobile image on mobile */
    .mobile-img {
        display: block;
    }

    /* Hide the desktop image on mobile */
    .desktop-img {
        display: none;
    }
}

.gamebannerBox h2 { font-size: 18px; color: #ffffff; font-weight: 700; margin: 0px; padding: 0px; }
.gamebannerBox .gridBox { font-size: 14px; color: #404040; line-height: 24px; }
.gamebannerBox p { padding: 0px 0px 10px 0px; font-size: 14px; color: #fff; line-height: 21px; }

.gridBox { width:100%; padding: 20px 0px 10px 0px; }

@media screen and (max-width: 767px) {
    .gridBox { width:100%; padding: .0px 0px 10px 0px; }
}

.gridBox h1 { font-size:26px;color:#285dab;font-weight:700;margin-bottom:5px; font-family: "Roboto Slab", serif; }
.gridBox .price .rate-pay,.featured-set .composeBox .price .rate-pay { font-size:11px;font-weight:normal;color:#111;margin:0; text-transform: uppercase!important; }
.gridBox .price .rate-pay,.featured-set .composeBox .price span.rate-pay { background: #fff; color: #111; margin: 0px 4px; padding: 6px; text-align: center; }
.gridBox .rate-pay-banner { clear:both; width:100%; height:32px; margin:0 0 10px; padding:4px 15px; }
.ups-racunari { margin-top: 10px; }

.step3Box { width:100%; }
.step3Box .title{ position:relative;border:1px solid #ddd;padding:17px 0 17px 17px; }
.step3Box .title h2 { font-size:20px;color:#333;font-weight:700;margin:0;padding:0; }
.step3Box .gridBox .block { margin-top:20px;position:relative;padding:20px 30px; border-radius: 5px; border: 1px solid #ddd; transition: all .5s ease; }
.step3Box .gridBox .block:hover { border: 1px solid #3a3a3a; transition: all .5s ease; }

.step3Box .gridBox .block p { padding:27px 0 0; }
.step3Box .gridBox h4 { font-size:22px;margin:0; }
.step3Box .gridBox a { text-decoration:none; }
.step3Box .gridBox .price { padding-bottom:15px;font-size:23px;font-weight: 900;color:#717171; }
.step3Box .gridBox .rating-box { margin-bottom:20px; }
.step3Box .gridBox .buttons { clear:both;margin-right:-8px; }
.step3Box .gridBox .btn2 { width:50%;float:left;padding:0 8px 0 0; }
.step3Box .gridBox .button { width:100%;position:static;border:none; }
.step3Box .gridBox .block:hover .button { background:#272727; }
.step3Box .gridBox .button.green,.step3Box .gridBox .block:hover .button.green { background:#29cb85; }
.step3Box .gridBox a.link { padding: 50px 0px 0px 0px; text-decoration: none; font-size: 14px; position: absolute; left: 30px; bottom: 0px; width: calc(100% - 30px); height: 100px; background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 71%, rgba(255, 255, 255, 1) 74%, rgba(255, 255, 255, 1) 86%); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 71%, rgba(255, 255, 255, 1) 74%, rgba(255, 255, 255, 1) 86%); background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 71%, rgba(255, 255, 255, 1) 74%, rgba(255, 255, 255, 1) 86%); }
.step3Box .gridBox a.link:before { font-size:22px;position:relative;top:2px;margin-right:5px;font-family:FontAwesome;content:"\f107"; }
.step1Box .title{ position:relative;border:1px solid #ddd;padding:17px 0 17px 17px; }
.step1Box .title h2 { font-size:20px;color:#333;font-weight:700;display:inline-block;margin:0;padding:0 21px 0 0; }
.step1Box .title span { font-size: 14px; }
.step1Box .tabcontentBox .block { position:relative; }
.step1Box .on { width:37px;height:22px;display:block;position:absolute;right:22px;bottom:20px;background:url(/game_computer_store/img/on.png) left top no-repeat; }
.step1Box .off { width:37px;height:22px;display:block;position:absolute;right:22px;bottom:20px;background:url(/game_computer_store/img/off.png) left top no-repeat; }
.step1Box .name { float: left; padding: 15px 0px 0px 30px; font-size: 14px; }
.bottom_blockBox .button.black { margin-right: 5px; background: #272727; transition: background .1s linear; }
.bottom_blockBox .button.black:hover { background: #3c3c3c; transition: background .1s linear; }
.stepBox { width:100%;margin-bottom:13px;border-bottom:none; }
.stepBox ul { list-style:none;padding:0; }
.stepBox p { font-size: 14px;color:#727272;margin:0;padding:9px 0 0; }
.stepBox li { padding:10px 12px 25px 10px; float: left; width: 100%; border-radius:5px; border-left: 3px solid #ddd; background: #111; color: #111; width: 100%; margin-bottom: 5px; border: 1px solid #ddd; }
.stepBox li a { position:relative;display:block;font-size:16px;color:#9e9e9e;font-weight: 900;line-height:38px;border:1px solid #ddd;background:#111;padding:12px 0 5px 13px; border-radius: 5px; }
.stepBox li .count { position: relative;margin-right: 8px; width: 38px; height: 38px; text-align: center; line-height: 38px; display: block; background: #ddd; float: left; border-radius: 100%; top: -3px; }
.stepBox li.active { border-left: 3px solid #0090e2; background: #ddd; color: #111; width: 100%; }
.stepBox li.active .count { background:#29cb85;color:#fff; top: -3px;  }
.stepBox li.active a { margin-right:-1px;color:#fff;border:1px solid #ddd;border-right:1px solid transparent; background: #111; }
.stepBox li.sucess { background:#ddd; }
.stepBox li.sucess .count:before { position: absolute; left: 0px; top: 0px; width: 38px; height: 38px; display: block; border-radius: 100%; background: #29cb85; font-family: 'FontAwesome'; content: "\f00c"; color: #fff; }
.stepBox li.sucess a { margin: 0px; color: #29cb85; }
.bottom_blockBox { width:100%;overflow:hidden;font-size: 14px;border:1px solid #ddd;border-radius: 3px; padding: 0px 0px 0px 0px; margin: 0px; background: #ddd; }
.bottom_blockBox a.refresh { font-size: 14px; width: 200px; position: relative; display: inline-block; line-height: 63px; color: #949494; float: left; text-decoration: none; padding: 11px 5px 0 40px; margin-left: 15px; }
.bottom_blockBox a.refresh:after { position:absolute;left:10px;top:12px;font-family:FontAwesome;content:"\f021";font-size:20px; }
.bottom_blockBox .right { width:calc(100%-192px);float:right; padding: 20px 20px 0px 20px; }
.bottom_blockBox p { position:relative;text-align:right;float:right;margin:0;padding:0 35px 0 0; }
.bottom_blockBox p:after { position:absolute;right:10px;top:0;font-family:FontAwesome;content:"\f061";font-size:20px;color:#7b7b7b; }
.bottom_blockBox .button { position: relative; width: 263px; height: 47px; display: block; float: right; border-radius: 3px; font-size: 16px; color: #fff; text-decoration: none; text-align: center; color: #fff; border-color: #f60; background-color: #f60; margin-bottom: 10px; transition: background .1s linear; }
.bottom_blockBox .button:hover { background: #28d58a; transition: background .1s linear; }
.bottom_blockBox .button:after { position:absolute;right:11px;top:10px;font-family:FontAwesome;content:"\f105";font-size:20px; }
.img-konfig { display: flex; justify-content: center; align-items: center; height: 200px; }

@media only screen and (max-width: 767px) {
    .bottom_blockBox .right { width: 100%; }
    .gridBox .price .rate-pay,.featured-set .composeBox .price span.rate-pay { margin-right: -20px; }
}

@media only screen and (max-width: 320px) {
    .gridBox .price .rate-pay,.featured-set .composeBox .price span.rate-pay { 
        margin-right: -20px;
        width: 100px; 
    }
}

.errorBox { text-align: center; border: 1px solid #ddd; border-radius: 5px; padding: 20px; }
.errorBox h1 { font-size: 21px; } 
.errorBox ul { padding:0; }
.errorBox ul li:before { content:'-';margin-right:2px; }
.block.active { border: 1px solid #f60!important; transition: all .5s ease;  }
.hide { display: none!important; }

#gameoptionCntr .tabcontentBox { width:100%; }
#gameoptionCntr .tabcontentBox .title{ position:relative;border:1px solid #ddd;padding:17px 0 17px 17px; }
#gameoptionCntr .tabcontentBox .title h2 { font-size:20px;color:#e10817;font-weight:700;margin:0;padding:0; }
#gameoptionCntr .tabcontentBox p { font-size: 14px;color:#333;line-height:21px;margin:0;padding:17px 0 20px; }
#gameoptionCntr .tabcontentBox .block { border: 1px solid #ddd; width: calc(16.6% - 25px); margin: 0 25px 20px 0; float: left; }
#gameoptionCntr .tabcontentBox .subtitle{ position:relative;border-bottom:1px solid #ddd;border-left:2px solid transparent;font-size:12px;color:#fff;padding:10px 17px; }
#gameoptionCntr .tabcontentBox .image { overflow:hidden;position:relative;padding:25px 20px; }
#gameoptionCntr .tabcontentBox .image img { width:100%; }
#gameoptionCntr .tabcontentBox .action{ position:absolute;right:0;top:0; }
#gameoptionCntr .tabcontentBox .action a { width:60px;height:56px;text-align:center;font-size:20px;color:#999;line-height:56px;border:1px solid transparent;float:left;text-decoration:none; }
#gameoptionCntr .tabcontentBox .action a.active,#gameoptionCntr .tabcontentBox .action a:hover { border:1px solid #dcdcdc;color:#333; }
#gameoptionCntr .tabcontentBox .info { float:right;font-size:20px;color:#888;text-decoration:none; }
#gameoptionCntr .tabcontentBox .info:hover { color:#333;text-decoration:none; }
#gameoptionCntr .tabcontentBox .price { font-size: 14px;color:#333;float:right; }
#gameoptionCntr .tabcontentBox .newbtn { width:118px;height:24px;border:1px solid #29cb85;float:left;font-size: 14px;color:#333;text-align:center;text-decoration:none; }
#gameoptionCntr .tabcontentBox .block:hover,.tabcontentBox .block.active{cursor:pointer;border:1px solid #ddd; transition: all .5s ease; }
#gameoptionCntr .tabcontentBox .block:hover .subtitle,#gameoptionCntr .tabcontentBox .block.active .subtitle { background:#ddd;border-left:3px solid #0090e2;margin-left:-1px; }
#gameoptionCntr .tabcontentBox .image2 { width:102px; height: 130px; border:1px solid #ddd;margin:13px auto 24px;padding:4px; }
#gameoptionCntr .tabcontentBox .image2 img { width:100%;max-width:102px; }
.hdaction{ position:absolute;top:0px; float:right; right:10px; }
.hdaction ul { float:right; }
.hdaction li { float:left;font-size: 14px;color:#fff;line-height:33px;margin-top:-1px;border:1px solid transparent;padding:0 21px; margin-top: 8px; transition: all .5s ease; }
.hdaction li a { color:#fff;text-decoration:none; }
.hdaction li:hover,.hdaction li.active { background: #ddd; border: 1px solid transparent; color: #111!important; margin-top: 8px; transition: all .5s ease; }
.hdaction li.description:hover { background:transparent; color:#fff!important; }
.hdaction li:last-child,.hdaction li:last-child .active { margin-right:-1px; }

@media only screen and (max-width: 479px) {
    .step3Box .title h2 { display:none!important; }
    .hdaction {right: 30px; }
}

.tab2-content .block:hover, .tab2-content .block.active { box-shadow: 1px 1px 6px 0 rgba(0, 0, 0, 0.2); }
.pretty * { box-sizing: border-box; }
.pretty input:not([type=checkbox]):not([type=radio]) { display: none; }
.pretty { position: relative; display: inline-block; margin-right: 1em; white-space: nowrap; line-height: 1; }
.pretty input{ position:absolute;left:0;top:0;min-width:1em;width:100%;height:100%;z-index:2;opacity:0;cursor:pointer;margin:0;padding:0; }
.pretty .state label { position: initial; display: inline-block; font-weight: 400; margin: 0; text-indent: 1.5em; min-width: 50px; margin:0px!important; padding: 0px!important; }
.pretty .state label:after, .pretty .state label:before { content: ''; width: calc(1em + 2px); height: calc(1em + 2px); display: block; box-sizing: border-box; border-radius: 0; border: 1px solid transparent; z-index: 0; position: absolute; left: 0; top: calc((0% - (100% - 1em)) - 8%); background-color: transparent; }
.pretty .state label:before { border-color: #bdc3c7; }
.pretty .state.p-is-hover, .pretty .state.p-is-indeterminate { display: none; }
.pretty.p-default.p-fill .state label:after { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
.pretty.p-default .state label:after { -webkit-transform: scale(.6); -ms-transform: scale(.6); transform: scale(.6); }
.pretty.p-default input:checked~.state label:after { background-color: #bdc3c7 !important; }
.pretty.p-default.p-thick .state label:after, .pretty.p-default.p-thick .state label:before { border-width: calc(1em / 7); }
.pretty.p-default.p-thick .state label:after { -webkit-transform: scale(.4) !important; -ms-transform: scale(.4) !important; transform: scale(.4) !important; }
.pretty.p-icon .state .icon { position: absolute; font-size: 1em; width: calc(1em + 2px); height: calc(1em + 2px); left: 0; z-index: 1; text-align: center; line-height: normal; top: calc((0% - (100% - 1em)) - 8%); border: 1px solid transparent; opacity: 0; }
.pretty.p-icon .state .icon:before { margin: 0; width: 100%; height: 100%; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 1; }
.pretty.p-icon input:checked~.state .icon { opacity: 1; }
.pretty.p-icon input:checked~.state label:before { border-color: #5a656b; }
.pretty.p-svg .state .svg { position: absolute; font-size: 1em; width: calc(1em + 2px); height: calc(1em + 2px); left: 0; z-index: 1; text-align: center; line-height: normal; top: calc((0% - (100% - 1em)) - 8%); border: 1px solid transparent; opacity: 0; }
.pretty.p-svg .state svg { margin: 0; width: 100%; height: 100%; text-align: center; display: -webkit-box; display: -ms-flexbox;  display: flex; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 1; }
.pretty.p-svg input:checked~.state .svg { opacity: 1; }
.pretty.p-image .state img { opacity: 0; position: absolute; width: calc(1em + 2px); height: calc(1em + 2px); top: 0; top: calc((0% - (100% - 1em)) - 8%); left: 0; z-index: 0; text-align: center; line-height: normal; -webkit-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8); }
.pretty.p-image input:checked~.state img { opacity: 1; }
.pretty.p-switch input { min-width: 2em; }
.pretty.p-switch .state { position: relative; }
.pretty.p-switch .state:before { content: ''; border: 1px solid #bdc3c7; border-radius: 60px; width: 2em; box-sizing: unset; height: calc(1em + 2px); position: absolute; top: 0; top: calc((0% - (100% - 1em)) - 16%); z-index: 0; transition: all .5s ease; }
.pretty.p-switch .state label { text-indent: 2.5em; }
.pretty.p-switch .state label:after, .pretty.p-switch .state label:before { transition: all .5s ease; border-radius: 100%; top:-12px!important; left: 0; border-color: transparent; -webkit-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8); }
.pretty.p-switch .state label:after { background-color: #bdc3c7 !important; }
.pretty.p-switch input:checked~.state:before { border-color: #5a656b; }
.pretty.p-switch input:checked~.state label:before { opacity: 0; }
.pretty.p-switch input:checked~.state label:after { background-color: #5a656b !important; left: 1em; }
.pretty.p-switch.p-fill input:checked~.state:before { border-color: #5a656b; background-color: #5a656b !important; }
.pretty.p-switch.p-fill input:checked~.state label:before { opacity: 0; }
.pretty.p-switch.p-fill input:checked~.state label:after { background-color: #fff !important; left: 1em; }
.pretty.p-switch.p-slim .state:before { height: .1em; background: #bdc3c7 !important; top: calc(50% - .1em); }
.pretty.p-switch.p-slim input:checked~.state:before { border-color: #5a656b; background-color: #5a656b !important; }
.pretty.p-has-hover input:hover~.state:not(.p-is-hover) { display: none; }
.pretty.p-has-hover input:hover~.state.p-is-hover, .pretty.p-has-hover input:hover~.state.p-is-hover .icon { display: block; }
.pretty.p-has-focus input:focus~.state label:before { box-shadow: 0 0 3px 0 #bdc3c7; }
.pretty.p-has-indeterminate input[type=checkbox]:indeterminate~.state:not(.p-is-indeterminate) { display: none; }
.pretty.p-has-indeterminate input[type=checkbox]:indeterminate~.state.p-is-indeterminate, .pretty.p-has-indeterminate input[type=checkbox]:indeterminate~.state.p-is-indeterminate .icon  { display: block; opacity: 1; }
.pretty.p-toggle .state.p-on { opacity: 0; display: none; }
.pretty.p-toggle .state .icon, .pretty.p-toggle .state .svg, .pretty.p-toggle .state img, .pretty.p-toggle .state.p-off { opacity: 1; display: inherit; }
.pretty.p-toggle .state.p-off .icon { color: #bdc3c7; }
.pretty.p-toggle input:checked~.state.p-on { opacity: 1; display: inherit; }
.pretty.p-toggle input:checked~.state.p-off { opacity: 0; display: none; }
.pretty.p-plain input:checked~.state label:before, .pretty.p-plain.p-toggle .state label:before { content: none; }
.pretty.p-plain.p-plain .icon { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }
.pretty.p-round .state label:after, .pretty.p-round .state label:before { border-radius: 100%; }
.pretty.p-round.p-icon .state .icon { border-radius: 100%; overflow: hidden; }
.pretty.p-round.p-icon .state .icon:before { -webkit-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8); }
.pretty.p-curve .state label:after, .pretty.p-curve .state label:before { border-radius: 20%; }
.pretty.p-smooth .icon, .pretty.p-smooth .svg, .pretty.p-smooth label:after, .pretty.p-smooth label:before, .pretty.p-smooth input:checked+.state label:after { transition: all .5s ease; }
.pretty.p-smooth input:checked+.state .icon, .pretty.p-smooth input:checked+.state .svg, .pretty.p-smooth input:checked+.state img, .pretty.p-smooth.p-default input:checked+.state label:after { -webkit-animation: zoom .2s ease; animation: zoom .2s ease; }
.pretty.p-smooth.p-plain input:checked+.state label:before { content: ''; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); transition: all .5s ease  }
.pretty.p-tada:not(.p-default) input:checked+.state .icon, .pretty.p-tada:not(.p-default) input:checked+.state .svg, .pretty.p-tada:not(.p-default) input:checked+.state img, .pretty.p-tada:not(.p-default) input:checked+.state label:after, .pretty.p-tada:not(.p-default) input:checked+.state label:before { -webkit-animation: tada .7s cubic-bezier(.25, .46, .45, .94) 1 alternate; animation: tada .7s cubic-bezier(.25, .46, .45, .94) 1 alternate; opacity: 1; }
.pretty.p-jelly:not(.p-default) input:checked+.state .icon, .pretty.p-jelly:not(.p-default) input:checked+.state .svg, .pretty.p-jelly:not(.p-default) input:checked+.state img, .pretty.p-jelly:not(.p-default) input:checked+.state label:after, .pretty.p-jelly:not(.p-default) input:checked+.state label:before { -webkit-animation: jelly .7s cubic-bezier(.25, .46, .45, .94); animation: jelly .7s cubic-bezier(.25, .46, .45, .94); opacity: 1; }
.pretty.p-jelly:not(.p-default) input:checked+.state label:before { border-color: transparent; }
.pretty.p-rotate:not(.p-default) input:checked~.state .icon, .pretty.p-rotate:not(.p-default) input:checked~.state .svg, .pretty.p-rotate:not(.p-default) input:checked~.state img, .pretty.p-rotate:not(.p-default) input:checked~.state label:after, .pretty.p-rotate:not(.p-default) input:checked~.state label:before { -webkit-animation: rotate .7s cubic-bezier(.25, .46, .45, .94); animation: rotate .7s cubic-bezier(.25, .46, .45, .94); opacity: 1; }
.pretty.p-rotate:not(.p-default) input:checked~.state label:before { border-color: transparent; }
.pretty.p-pulse:not(.p-switch) input:checked~.state label:before { -webkit-animation: pulse 1s; animation: pulse 1s; }
.pretty input[disabled] { cursor: not-allowed; display: none; }
.pretty input[disabled]~* { opacity: .5; }
.pretty.p-locked input { display: none; cursor: not-allowed; }
.pretty input:checked~.state.p-primary label:after, .pretty.p-toggle .state.p-primary label:after { background-color: #428bca !important; }
.pretty input:checked~.state.p-primary .icon, .pretty input:checked~.state.p-primary .svg, .pretty.p-toggle .state.p-primary .icon, .pretty.p-toggle .state.p-primary .svg { color: #fff; stroke: #fff; }
.pretty input:checked~.state.p-primary-o label:before, .pretty.p-toggle .state.p-primary-o label:before { border-color: #428bca; }
.pretty input:checked~.state.p-primary-o label:after, .pretty.p-toggle .state.p-primary-o label:after { background-color: transparent; }
.pretty input:checked~.state.p-primary-o .icon, .pretty input:checked~.state.p-primary-o .svg, .pretty input:checked~.state.p-primary-o svg, .pretty.p-toggle .state.p-primary-o .icon, .pretty.p-toggle .state.p-primary-o .svg, .pretty.p-toggle .state.p-primary-o svg { color: #428bca; stroke: #428bca; }
.pretty.p-default:not(.p-fill) input:checked~.state.p-primary-o label:after, .pretty.p-switch.p-fill input:checked~.state.p-primary:before { background-color: #428bca !important; }
.pretty.p-switch input:checked~.state.p-primary:before { border-color: #428bca; }
.pretty.p-switch.p-slim input:checked~.state.p-primary:before { border-color: #245682; background-color: #245682 !important; }
.pretty input:checked~.state.p-info label:after, .pretty.p-toggle .state.p-info label:after { background-color: #5bc0de !important; }
.pretty input:checked~.state.p-info .icon, .pretty input:checked~.state.p-info .svg, .pretty.p-toggle .state.p-info .icon, .pretty.p-toggle .state.p-info .svg { color: #fff; stroke: #fff}
.pretty input:checked~.state.p-info-o .icon,.pretty input:checked~.state.p-info-o .svg,.pretty input:checked~.state.p-info-o svg,.pretty.p-toggle .state.p-info-o .icon,.pretty.p-toggle .state.p-info-o .svg,.pretty.p-toggle .state.p-info-o svg { color:#5bc0de;stroke:#5bc0de; }
.pretty.p-switch.p-slim input:checked~.state.p-info:before { background-color:#2390b0!important;border-color:#2390b0; }
.pretty input:checked~.state.p-success-o .icon,.pretty input:checked~.state.p-success-o .svg,.pretty input:checked~.state.p-success-o svg,.pretty.p-toggle .state.p-success-o .icon,.pretty.p-toggle .state.p-success-o .svg,.pretty.p-toggle .state.p-success-o svg { color:#5cb85c;stroke:#5cb85c; }
.pretty.p-switch.p-slim input:checked~.state.p-success:before { background-color:#357935!important;border-color:#357935; }
.pretty input:checked~.state.p-warning label:after,.pretty.p-toggle .state.p-warning label:after { background-color:#f0ad4e!important; }
.pretty input:checked~.state.p-warning-o label:before,.pretty.p-toggle .state.p-warning-o label:before { border-color:#f0ad4e; }
.pretty input:checked~.state.p-info-o label:before,.pretty.p-toggle .state.p-info-o label:before,.pretty.p-switch input:checked~.state.p-info:before { border-color:#5bc0de; }
.pretty input:checked~.state.p-info-o label:after,.pretty.p-toggle .state.p-info-o label:after,.pretty input:checked~.state.p-success-o label:after,.pretty.p-toggle .state.p-success-o label:after,.pretty input:checked~.state.p-warning-o label:after,.pretty.p-toggle .state.p-warning-o label:after { background-color:transparent; }
.pretty.p-default:not(.p-fill) input:checked~.state.p-info-o label:after,.pretty.p-switch.p-fill input:checked~.state.p-info:before { background-color:#5bc0de!important; }
.pretty input:checked~.state.p-success label:after,.pretty.p-toggle .state.p-success label:after,.pretty.p-default:not(.p-fill) input:checked~.state.p-success-o label:after,.pretty.p-switch.p-fill input:checked~.state.p-success:before { background-color:#f60!important; }
.pretty input:checked~.state.p-success .icon,.pretty input:checked~.state.p-success .svg,.pretty.p-toggle .state.p-success .icon,.pretty.p-toggle .state.p-success .svg,.pretty input:checked~.state.p-warning .icon,.pretty input:checked~.state.p-warning .svg,.pretty.p-toggle .state.p-warning .icon,.pretty.p-toggle .state.p-warning .svg { color:#fff;stroke:#fff; }
.pretty input:checked~.state.p-success-o label:before,.pretty.p-toggle .state.p-success-o label:before,.pretty.p-switch input:checked~.state.p-success:before { border-color:#7c0a0d; }.pretty input:checked~.state.p-warning-o .icon, .pretty input:checked~.state.p-warning-o .svg, .pretty input:checked~.state.p-warning-o svg, .pretty.p-toggle .state.p-warning-o .icon, .pretty.p-toggle .state.p-warning-o .svg, .pretty.p-toggle .state.p-warning-o svg { color: #f0ad4e; stroke: #f0ad4e; }
.pretty.p-switch input:checked~.state.p-warning:before { border-color:#f0ad4e; }
.pretty.p-switch.p-slim input:checked~.state.p-warning:before { background-color:#c77c11!important;border-color:#c77c11; }
.pretty input:checked~.state.p-danger .icon,.pretty input:checked~.state.p-danger .svg,.pretty.p-toggle .state.p-danger .icon,.pretty.p-toggle .state.p-danger .svg { color:#fff;stroke:#fff; }
.pretty input:checked~.state.p-danger-o label:after,.pretty.p-toggle .state.p-danger-o label:after { background-color:transparent; }
.pretty input:checked~.state.p-danger-o .icon,.pretty input:checked~.state.p-danger-o .svg,.pretty input:checked~.state.p-danger-o svg,.pretty.p-toggle .state.p-danger-o .icon,.pretty.p-toggle .state.p-danger-o .svg,.pretty.p-toggle .state.p-danger-o svg { color:#d9534f;stroke:#d9534f; }
.pretty.p-switch.p-slim input:checked~.state.p-danger:before { background-color:#a02622!important;border-color:#a02622; }
.pretty.p-default:not(.p-fill) input:checked~.state.p-warning-o label:after,.pretty.p-switch.p-fill input:checked~.state.p-warning:before { background-color:#f0ad4e!important; }
.pretty input:checked~.state.p-danger label:after,.pretty.p-toggle .state.p-danger label:after,.pretty.p-default:not(.p-fill) input:checked~.state.p-danger-o label:after,.pretty.p-switch.p-fill input:checked~.state.p-danger:before { background-color:#d9534f!important; }
.pretty input:checked~.state.p-danger-o label:before,.pretty.p-toggle .state.p-danger-o label:before,.pretty.p-switch input:checked~.state.p-danger:before { border-color:#d9534f; }
.pretty.p-bigger .icon, .pretty.p-bigger .img, .pretty.p-bigger .svg, .pretty.p-bigger label:after, .pretty.p-bigger label:before { font-size: 1.2em !important; top: calc((0% - (100% - 1em)) - 35%) !important; }
.pretty.p-bigger label { text-indent: 1.7em; }
@media print {
    .pretty .state .icon, .pretty .state label:after, .pretty .state label:before, .pretty .state:before { color-adjust: exact; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
.tabcontentBox .pretty.p-switch.p-fill input:checked~.state label:after { background-color: #fff !important; left: 0.9em; box-shadow: 0px 2px 4px #717171; width: 1.3em; height: 1.3em; display: block; top: -9px; }
.tabcontentBox .pretty.p-switch.p-fill input:checked~.state.p-success:before { background-color: #f60!important; box-shadow: 0px 2px 2px #52525273 inset; }
.tabcontentBox .pretty.p-switch .state:before { background-color: #f9f9f9 !important; box-shadow: 0px 2px 2px #52525273 inset; }
.tabcontentBox .pretty.p-switch .state label:after { background-color: #f5f5f5 !important; }
/*.tabcontentBox .pretty.p-switch .state label:after, .pretty.p-switch .state label:before { transition: all .5s ease; border-radius: 100%; left: 0; border-color: transparent; -webkit-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8); background-color:#111!important; left: 0; box-shadow: 0px 2px 4px #71717163; width: 1.3em; height: 1.3em; display: block; top: -9px; }*/
.tabcontentBox .pretty { right: 0; position: absolute; bottom: 0; font-size: 1.2em; margin: 0; }
.tabcontentBox .pretty.p-switch.p-fill input~.state label { color: #fff; transition: all .5s ease; }
.tabcontentBox .pretty.p-switch.p-fill input:checked~.state label { color: #7b7b7b; transition: all .5s ease; }
.tabcontentBox .image2 { width:125px;border:1px solid #ddd;margin:13px auto 0;padding:4px; }
.tabcontentBox .rating { padding:20px; }
@media only screen and (max-width: 479px) {
    #gameoptionCntr .tabcontentBox .block { width: 100%; margin-right: 0px; }
    .pretty.p-switch .state label:after, .pretty.p-switch .state label:before { top:-12px!important; }
}
@media only screen and (max-width: 767px) {
    #gameoptionCntr .tabcontentBox .block { width: 100%; }
}
.step3Box { width:100%; margin-top: 52px; }
.step3Box .title { position:relative;border:1px solid #ddd;padding:17px 0 17px 17px; border-radius: 5px; }
.step3Box .title h2 { font-size:16px;color:#fff;font-weight:700;margin:0;padding:0; }

.step3Box .gridBox .block p { padding:27px 0 0; }
.step3Box .gridBox h4 { font-size:18px;margin:0; }
.step3Box .gridBox .price { padding:15px 0px 15px 0px;font-size:18px;font-weight: 900;color:#fff; float: right; }
.step3Box .gridBox .buttons { margin-right:-8px; }
.step3Box .gridBox .btn2 { float:left; color:#fff; margin-bottom:20px; padding:0 8px 0 0; width:100%!important; }
.step3Box .gridBox .button { width:100%;position:static;border:none;color:#fff; }
.step3Box .gridBox .block ul { clear:both;margin:0;padding:27px 0 0; }
.step3Box .gridBox .block ul.part-list { padding:0; border-top: 1px solid #ddd; padding-top: 15px; }
.step3Box .gridBox .block strong { min-width: 150px; float: left; }
.step3Box .gridBox .block:hover .button { background:#272727; }
.step3Box .gridBox .button.green,.step3Box .gridBox .block:hover .button.green { background:#29cb85; }
.step3Box .gridBox a.link { padding: 50px 0px 0px 20px; text-decoration: none; font-size: 14px; position: absolute; left: 30px; bottom: 0px; width: calc(100% - 30px); height: 100px; background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 71%, rgba(255, 255, 255, 1) 74%, rgba(255, 255, 255, 1) 86%); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 71%, rgba(255, 255, 255, 1) 74%, rgba(255, 255, 255, 1) 86%); background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 1) 71%, rgba(255, 255, 255, 1) 74%, rgba(255, 255, 255, 1) 86%); }
.step3Box .gridBox a.link:before { font-size:22px;position:relative;top:2px;margin-right:5px;font-family:FontAwesome;content:"\f107";margin-left:-20px; }
.subscribeBox { margin-bottom:20px;width:100%;overflow:hidden;border:1px solid #f2f2f2;padding:20px 15px 0; }
.subscribeBox h3 { padding-bottom:10px;font-size:22px;font-weight:700;margin:0; }
.subscribeBox p { display:block;font-size: 14px;color:#727272;text-align:left;margin:0;padding:0 0 13px; }
.subscribeBox p span { color:#27ae60; }
.subscribeBox p.top { padding-top:15px;font-size: 14px; }
.subscribeBox input[type="email"] { height: auto; border-radius: 0; box-shadow: none; padding: 0px 13px; line-height: 38px; font-size: 14px; width: calc(100% - 98px); float: left; background: #f6f6f6; border: 1px solid #f2f2f2; }
.subscribeBox .button { width: 98px;line-height: 39px; font-size: 14px; color: #fff; text-decoration: none; border: none; text-align: center; height: 39px; background: #272727; transition: background .1s linear; }
.subscribeBox .button:hover { text-decoration: none; background: #3c3c3c; transition: background .1s linear; }
.subscribeBox .has-error.help-block { float: left; }
.fblikeBox .icon { margin-right:9px;color:#3b5998; }
.fblikeBox p { font-size: 14px;color:#727272;line-height:24px; }
.fblikeBox p a { color:#727272;text-decoration:underline; }
.fblikeBox p a:hover { text-decoration:none; }
.listBox ul.link{list-style:none;padding:0; }
.listBox ul.link li { position:relative;line-height:26px; }
.listBox ul.link li a { font-size: 14px;color:#727272;text-decoration:none;padding:0 0 0 20px; }
.listBox ul.link li a:before { position:absolute;left:0;top:10px;content:'';width:5px;height:5px;background:#b2b2b2;border-radius:100%; }
.listBox ul.link li a:hover { color:#010101;text-decoration:underline; }
.listBox ul.link li a:hover:before,.listBox ul.link li a.active:before { background:#010101; }
.fblikeBox,.listBox { margin-bottom:20px;width:100%;overflow:hidden;border:1px solid #f2f2f2;padding:20px 15px 0; }
.fblikeBox h3,.listBox h3 { padding-bottom:10px;font-size:22px;font-weight:700;margin:0; }
.descriptionBox { width:100%;overflow:hidden;margin-top:20px;font-size: 14px;color:#333;line-height:27px; }
.descriptionBox h1 { padding-bottom:24px;font-size:17px;color:#333;font-weight:700;margin:0; }
.descriptionBox h2 { padding-bottom:21px;font-size:17px;color:#333;font-weight:700;margin:0; }
.descriptionBox h3 { padding-bottom:18px;font-size:17px;color:#333;font-weight:700;margin:0; }
.descriptionBox h4 { padding-bottom:15px;font-size:17px;color:#333;font-weight:700;margin:0; }
.descriptionBox h5 { padding-bottom:13px;font-size:17px;color:#333;font-weight:700;margin:0; }
.descriptionBox p { margin-bottom:28px;font-size: 14px;color:#333;line-height:27px; }
.sideinfoBox { width:100%;background:#f6f6f6;border:1px solid #ddd;margin-top:20px;padding:7px; }
.sideinfoBox .block { overflow:hidden;border:1px solid #ddd;background:#fff;padding:23px 22px; }
.sideinfoBox h4 { font-size:17px;font-weight:700;margin:0 0 10px; }
.sideinfoBox .list{list-style:none;margin:0; }
.sideinfoBox .list li { font-size: 14px;color:#333;line-height:27px; }
.sideinfoBox .list li a { position:relative;display:inline-block;font-size: 14px;color:#333;text-decoration:none;padding:0 0 0 18px; }
.sideinfoBox .list li a:before { position: absolute; left: 0px; top: -2px; font-family: 'FontAwesome'; content: "\f055"; color: #29cb85; }
.sideinfoBox .list li.active a:before { position: absolute; left: 0px; top: -2px; font-family: 'FontAwesome'; content: "\f056"; color: #ff6c00; }
.specifiesList { margin-top: 6px;  padding: 20px 0px; width: 100%; border: 1px solid #ddd; background: #fff; }
.mobilebanifit { overflow: hidden; margin: 17px 0px 10px 0px; padding: 18px; border: 1px solid #e7e7e7; border-radius: 3px; }
.mobilebanifit p { margin: 0px; width: calc(100% - 140px); float: left; font-size: 16px; color: #727272; line-height: 25px; }
.mobilebanifit .logo { float: right; }

@media only screen and (max-width: 479px) {
    .mobilebanifit { text-align:center; }
    .mobilebanifit p { width:100%; }
    .mobilebanifit .logo { float:none;display:inline-block;margin:5px 0 0; }
    .step3Box { margin-top: 22px; }
    .step3Box .title { padding:17px 0 35px 17px; }
    .step3Box .gridBox .block strong { width: 100%; }
}
.mobiledropdown { line-height: 57px; width: 100%; position: relative; font-size: 14px; color: #fff; font-weight: 900; display: block; text-align: center; text-decoration: none; background: #e10717; border-radius: 3px; }
.mobiledropdown:after { position: absolute; right: 20px; top: 0px; font-family: 'FontAwesome'; content: "\f107"; font-size: 36px; color: #fff; }
.mobiledropdown:hover { color: #fff; text-decoration: none; }
#one-step-checkout-form .form-control { display: block; width: 100%; max-width: 100%; height: 40px; font-family: "DM Sans", sans-serif; color: #fff; border: 1px solid #ddd; border-radius: 5px; background: transparent; padding: 0.3125rem 0.9375rem; font-size: 14px; color: #111!important; box-shadow: none; outline: none; }
#one-step-checkout-form .form-control:active, #one-step-checkout-form .form-control:focus { border: 1px solid #626262; }
#one-step-checkout-form .address-box span.required { position: absolute;top: 10px; right: 23px; color: #626262; }
ul.part-image-display li { list-style: none; display: none; transition:.3s ease-in-out; }
ul.part-image-display li.active { display: block; transition:.3s ease-in-out; }
.image-selection-blocks li { list-style: none; display: inline-block; }
.filterbtn { display: none; }
.rangeSlider { padding: 10px 0px 0 0; width: 100%; overflow: hidden; }
.rangeSlider .ui-slider .ui-slider-handle { width: 13px; height: 13px; display: inline-block; background: #fff; border: 1px solid #7f7f7f; border-radius: 100%; }
.rangeSlider .ui-slider { height: 4px; background: #dedede; }
.rangeSlider .ui-slider-horizontal .ui-slider-range { height: 4px; background: #7f7f7f; }
.rangeSlider input[type="text"] { padding: 0px 8px; width: 76px; height: 29px; line-height: 29px; border: 1px solid #ddd; font-size: 14px; color: #333333; text-align: center; float: left; }
.rangeSlider .slider { padding: 6px 6px; }
.rangeSlider .ui-slider { margin-bottom: 16px; }
.rangeSlider .label { width: calc(100% - 160px); line-height: 31px; font-size: 14px; color: #666666; font-weight: normal; display: block; float: left; text-align: center; }
.rangeSlider input[type="text"].right { float: right; }
.rangeSlider .row { padding: 23px 0px 0px 0px; }
.ui-slider-horizontal.ui-slider-handle { top: -.6em !important; }
.mobile-head { display:none; }
.shoppingdropdown ul { padding:0; }
.shoppingdropdown .head { width:100%;overflow:hidden;border-bottom:1px solid #ddd;padding:15px 20px; }
.shoppingdropdown .head strong { float:left;font-size:17px;color:#fff;font-weight:700; }
.shoppingdropdown .head p { float:right;font-size: 14px;color:#fff;margin:0; }
.shoppingdropdown .head p span { color: #ff6600; }
.mobile-menu .panel-group .panel .shoppingdropdown ul { list-style: none; margin: 0px; padding: 0; }
.panel-group { margin:20px 0 10px; }
.panel-group .panel + .panel { margin-top:0; }
.panel-title { margin-top:10px;margin-bottom:0;font-size: 13px;color:#111;font-weight:700; }
.shoppingdropdown li { width:100%;overflow:hidden;border-bottom:1px solid #ddd;padding:15px 20px; }
.shoppingdropdown .image { width: 85px; float: left; padding: 0px 10px 0px 0px; height: 73px; }
.shoppingdropdown .image img { max-width: 73px; width: 100%; }
.shoppingdropdown .detail { width: calc(100% - 85px); float: left; overflow: hidden;    position: relative; }
.shoppingdropdown .detail a { color: #fff; }
.shoppingdropdown .detail p { margin: 0px; font-size: 16px; color: #fff; }
.shoppingdropdown .detail span { font-size: 14px; color: #fff; display: block; }
.shoppingdropdown .close_x { font-size: 14px;color:#fff;text-decoration:none;position:absolute;top:0;right:0; }
.shoppingdropdown .total { width:100%;font-size:21px;color:#fff;font-weight:700;overflow:hidden;border-bottom:1px solid #ddd;padding:15px 20px; }
.shoppingdropdown .btn-continue { float:right;margin:13px 20px; }
.shoppingdropdown .total p { margin:0; }
.shoppingdropdown p.text { width:100%;font-size: 14px;color:#fff;text-align:right;margin:0;padding:0 20px; }
.shoppingdropdown p.cart-empty-notice { padding:15px 20px; }
.shoppingdropdown { padding:0 0 100px; }
.shoppingdropdown.empty-cart { padding:0; }

.empty-cart { text-align: center; min-height: 500px; border: 1px solid #ddd; border-radius: 5px; padding: 20px; }
.img-center { display: inline-block; margin: 40px 0px 40px 0px; width: 60%; max-width: 200px; }

        .main-content-wrapper {
            width: 100%;
            max-width: 1100px;
            margin-bottom: 40px;
            margin-top: 30px;
        }

        .g-wrapper {
            width: 100%;
            margin-bottom: 3rem;
        }
        .g-wrapper h2 {
            font-size: 2rem;
            font-weight: 900;
            text-transform: uppercase;
            text-align: center;
            margin-bottom: 2rem;
            color: #1a1a1a;
        }
        .g-container {
            display: flex;
            align-items: stretch;
            gap: 1.5rem;
        }
        .g-column-left {
            flex: 1;
            display: flex;
        }
        .g-column-right {
            flex: 1.5;
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
        }
        .g-bottom-row {
            display: flex;
            gap: 1.5rem;
        }
        .g-card {
            background-color: #ffffff;
            border-radius: 20px;
            padding: 1.5rem;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
            display: flex;
            flex: 1;
            flex-direction: column;
            justify-content: center;
        }
        .g-card h3 {
            font-size: 16px !important;
            font-weight: 700;
            color: #222;
            margin: 0.5rem 0;
        }
        .g-card p {
            font-size: 0.9rem;
            color: #555;
            line-height: 1.4;
            margin: 0;
        }
        .g-card-dolby {
            align-items: center;
            text-align: center;
        }
        .g-card-dolby img {
            max-width: 130px;
            margin-bottom: 1rem;
        }
        .g-card-d-array {
            flex-direction: row;
            align-items: center;
            gap: 1.5rem;
            flex-grow: 0;
        }
        .g-card-d-array img {
            max-width: 80px;
            flex-shrink: 0;
        }
        .g-card-4k, .g-card-vidaa {
            align-items: center;
            text-align: center;
        }
        .g-card-vidaa img {
            max-width: 70px;
            height: 70px;
            object-fit: contain;
            margin-bottom: 0.75rem;
        }
        .g-card-4k img {
            max-width: 40px;
            height: 40px;
            object-fit: contain;
            margin-bottom: 0.75rem;
        }

        /*
        ============================================================
        == COMPONENT 2: 2 Stacked Blocks (prefixed with "b-")
        ============================================================
        */
        .b-container {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 2rem;
        }
.b-block {
    display: flex;
    /* align-items: center; has been removed */
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.07);
    overflow: hidden;
}
        .b-image {
            flex: 0 0 45%;
        }
        .b-image img {
            width: 100%;
            height: 100%;
            object-fit: cover; /* This fills the container, removing white space */
            display: block;
        }
        .b-content {
            flex: 1;
            padding: 2.5rem;
        }
        .b-header {
            display: flex;
            align-items: center;
            margin-bottom: 1rem;
        }
        .b-icon {
            width: 50px;
            height: 50px;
            margin-right: 1rem;
        }
        .b-content h3 {
            font-size: 1.8rem;
            margin: 0;
            font-weight: 700;
        }
        .b-content h4 {
            font-weight: 700;
            color: #333!important;
            font-size: 1.1rem;
            margin: 0 0 0.5rem 0;
        }
        .b-content p {
            font-size: 1rem;
            line-height: 1.6;
            color: #555;
            margin: 0;
        }
        .b-block.reversed {
            flex-direction: row-reverse;
        }

        /*
        ============================================================
        == RESPONSIVE STYLES
        ============================================================
        */
        @media (max-width: 768px) {
            /* Grid Component Responsive */
            .g-container, .g-bottom-row {
                flex-direction: column;
            }
            .g-column-right {
                flex-basis: auto;
            }

            /* Block Component Responsive */
            .b-block,
            .b-block.reversed {
                flex-direction: column;
            }
            .b-image {
                width: 100%;
                flex-basis: auto;
            }
            .b-content {
                padding: 1.5rem;
            }
        }

        
.r-tabs .r-tabs-accordion-title { display:none; }
.nickspace{postition:relative; }
.nickspace img { position:absolute;bottom:0; }
.share-icon .fa,.download-icon .fa { margin-right:7px; }
.fancy-share,.fancy-save { padding:15px; }
.fancy-share i,.fancy-save i { font-size:22px;margin:0; }
.fancy-share>center,.fancy-save>center { clear:both;display:block;padding:10px 0; }
.fancy-share .sharelink { display:inline-block;float:left; }
.fancy-share>h3,.fancy-save>h3 { font-weight:700;font-size:22px;margin:0;padding:0 0 10px; }
.fancy-share>h4,.fancy-save>h4 { font-size:16px;display:block;font-weight:400; }
.fancy-share p,.fancy-save p { font-size: 14px;line-height:21px;display:block;clear:both;text-align:left;padding:0; }
.fancy-share a,.fancy-save a { text-decoration:underline; }
.fancy-share a:hover,.fancy-save a:hover { text-decoration:none; }
.fancy-share input,.fancy-save input { width:100%;border:1px solid #ddd;background:#111;font-size: 14px;padding:15px;border-radius:25px; }
.fancy-share .social { text-align:center; }
.fancy-share .social img { display:inline-block; }
.fancy-share .social img:hover { opacity: 0.75; }
.fancy-share .close { position: absolute; top: 5px; right: 15px; transition: all 200ms; font-size: 30px; font-weight: bold; text-decoration: none; color: #fff; opacity: 1; }
.fancy-save button { font-size: 14px; background: #ffffff; line-height: 25px; padding: 5px 10px 5px 10px;  border: 1px solid #e3ebed; border-radius: 2px; }
.fancy-save button:hover { border:1px solid #e3e3e3;text-decoration:none; }
.copy-link-holder { margin:20px 0; }
.webshopBox { overflow:hidden;margin:0;padding:0; }
.webshopBox ul { list-style:none;overflow:hidden;margin:0;padding:0; }
.webshopBox li { float: left; width: 31%; margin: 0 20px 20px 0; border: 1px solid #ddd; border-radius: 2px; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.webshopBox li:nth-child(3n) { margin-right: 0; }
.webshopBox li:hover { border: 1px solid #b4b4b4; }
.webshopBox h2 { font-size: 22px; font-weight: 900; margin-bottom: 10px; }
.webshopBox .photo { min-height: 115px; width: 100%; }
.webshopBox .photo img { width: 100% }
.webshopBox h3 { font-size: 19px; font-weight: 900; margin-bottom: 5px; }
.webshopBox p { line-height: 23px; min-height: 160px; margin-bottom: 10px; }
.webshopBox p a { color: #212121; }
.webshopBox a.button { display: block; background: #28d58a; text-align: center; line-height: 40px; color: #fff; font-weight: bold; text-decoration: none; border-radius: 2px; font-size: 14px; }
.webshopBox a.button:hover { background: #282828; }
@media only screen and (max-width: 479px) {
    .webshopBox li { margin-right: 0; width: 100%; }
}
@media (max-width: 768px) {
    .webshopBox li:nth-child(3n) { margin-right:0; }
    .webshopBox li { width:calc(50%-10px);margin-right:20px!important; }
    .webshopBox li:nth-child(2n) { margin-right:0!important; }
}
.blog-Box .blogBox ul { margin:0;padding:0; }
.blog-Box .blogBox { width:100%;overflow:hidden;margin-bottom:-33px;padding:40px 0; }
.blog-Box .blogBox h2 { font-size:22px;font-weight:700;margin:0;padding:0 0 18px; }
.blog-Box .blogBox h2 span { display:inline-block;font-size: 14px;color:#727272;line-height:22px;font-weight:400;padding:0 0 0 22px; }
.blog-Box .blogBox a.link { font-size: 14px;color:#727272;text-decoration:underline; }
.blog-Box .blogBox a.link:hover { text-decoration:none; }
.blog-Box .blogBox .holder { margin-right:-26px; }
.blog-Box .blogBox .block { margin-right:26px;width:calc(25%-26px);float:left;background:#fff;border:1px solid #ddd;padding:20px; }
.blog-Box .blogBox .block:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1)}
.blog-Box .blogBox h3 { font-size:16px;font-weight:700; }
.blog-Box .blogBox h3 a { line-height:23px; }
.blog-Box .blogBox h3 a:hover { color:#e10817;text-decoration:none; }
.blog-Box .blogBox p { font-size: 14px;color:#333;line-height:25px; }
.blog-Box .blogBox .date{ position:relative;font-family: "DM Sans", sans-serif;font-size: 14px;color:#8e8e8e; }
.blog-Box .blogBox .date:before { margin-right:5px;font-family:FontAwesome;content:"\f017";font-size:18px;color:#ff761b; }
.blog-Box .blogBox .image,.blog-Box .blogBox .image img { width:100%; }
.collapse-invoice-address>div>div>div { margin-bottom: 15px; }
@media only screen and (max-width: 1024px) {
    .cart-left { width: 100%; }
}

        .cookie-bar {
            background-color: #fff;
            color: #111;
            display: table;
            width: 100%;
            position: fixed;
            z-index: 999999;
            bottom: 0;
            padding: 5px 0;
            /* --- SOFT SHADOW ADDED HERE --- */
            /* This adds a subtle shadow to the top edge of the bar. */
            box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.08);
        }

        /* * This is the crucial CSS rule that was likely missing.
         * It moves the bar off-screen when the JavaScript adds the 'is-hidden' class.
        */
        .cookie-bar.is-hidden {
            transform: translateY(100%);
        }

        .cookie-bar a {
            color: #111;
            text-decoration: underline;
        }

        .cookie-bar a:hover {
            color: #111;
            text-decoration: underline;
        }

        .cookie-bar .message {
            display: table-cell;
            text-align: left;
            font-size: 14px;
            padding: 5px 10px;
        }

        .cookie-bar .actions {
            display: table-cell;
            vertical-align: middle;
            padding: 10px;
            text-align: right;
        }

        .cookie-bar .accept {
            display: inline-block;
            font-size: 14px;
            text-align: center;
            border-color: #00b900;
            background-color: #00b900;
            color: #fff;
            border-radius: 5px;
            min-height: 45px;
            box-shadow: inset 0 -2px 0 0 #090;
            min-width: 200px;
            text-decoration: none;
            border-style: solid; 
            cursor: pointer;
        }

        .cookie-bar a.btn {
            color: #111;
            display: inline-block;
            background-color: #2ecc71;
            text-decoration: none;
            border-radius: 2px;
            font-size: 14px;
            line-height: 15px;
            padding: 4px 10px;
        }

        @media only screen and (max-width: 560px) {
            .cookie-bar .message {
                float: left;
                width: 100%;
                text-align: center;
                padding-bottom: 0px;
            }

            .cookie-bar .actions {
                float: left;
                width: 100%;
                text-align: center;
            }

            .cookie-bar .accept {
                width: 100% !important;
            }
        }

@media only screen and (max-width: 312px) {
    .spacert { height: 200px; }
}
@media only screen and (max-width: 338px) {
    .spacert { height: 166px; }
}
@media only screen and (max-width: 349px) {
    .spacert { height: 139px; }
}
@media only screen and (max-width: 427px) {
    .spacert { height: 78px; }
}
@media only screen and (max-width: 446px) {
    .spacert { height: 40px; }
}
@media only screen and (max-width: 523px) {
    .spacert { height: 25px; }
}

.naj-prodavanijih { width: 100%; height: 20px; margin-top: -20px; position: relative; float: left; background-size: cover; text-transform: uppercase; color: #ffffff; }
.naj-prodavanijih span { position: relative; display: block; text-align: center; background: #ff6348; font-size: 12px; line-height: 1; padding: 5px; border-radius: 2px; width: 100%; bottom: 10px; }
.description{line-height:2.1;padding-bottom:10px;font-size: 14px;color:#111; }
.description p { margin-bottom:2.5rem;color:#111; }
.description h1 { font-weight:700;font-size:1.6875rem; }
.description h3 { font-weight:700;margin-bottom:10px; }
.description__info { padding-top:.125rem; }
.description__info a { font-size: 14px; }
.description__info li { position:relative; font-size: 14px; }
.description__info li img { position:absolute;top:.125rem;left:0; }
.brochure { padding-right: 1.875rem; padding-left: 1.875rem; margin-bottom: 1.625rem; background-position: center bottom; background-repeat: no-repeat; background-size: cover; }
.brochure p { font-weight: 900;text-transform:uppercase;font-size:1.1875rem; }
.brochure h3 { font-weight:700;line-height:1.2;text-transform:uppercase;margin-bottom:.4375rem;font-size:2.4375rem; }
.brochure h4 { font-weight:700;text-transform:uppercase;color:#f60;margin-bottom:.4375rem;font-size:1.1875rem; }
.brochure img { margin-top:-.625rem;margin-bottom:-1.6875rem; }
.brochure__text { padding-top:1.875rem;padding-right:0; }
@media only screen and (max-width: 479px) {
    .brochure { padding-right: 0.9375rem; padding-left: 0.9375rem; margin-bottom: 2.1875rem; }
    .brochure h3 { font-size: 2rem; }
}
p.opci-uvjeti { font-size:12px;color:#b4b4b4;line-height:18px; }
.user-login .form-actions { margin-bottom:15px; }
.password-reset .fieldset .input-group .btn{line-height:0.9; }
.offers-table .image img { border:1px solid #f2f2f2;border-radius:2px;max-width:100%; }
.popupBox { background:#fff; }
.popupBox .tabs { margin:0 0 20px; }
.popupBox .tabs.r-tabs-nav { background-color:#fff; }
.checkbox-container { display: block; position: relative; padding-left: 22px; cursor: pointer; font-size: 14px; font-weight: 400; height: 16px; line-height: 17px; color: #111; max-width: 120px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background: transparent; }
.checkbox-container input { position: absolute; opacity: 0; cursor: pointer; }
.checkbox-container .checkmark { position: absolute; left: 0;  height: 16px; width: 16px; border: 1px solid #6a6a6a; border-radius: 5px; transition: background .25s ease-in-out; -moz-transition: background .25s ease-in-out; -webkit-transition: background .25s ease-in-out; }
.checkbox-container .checkmark:hover { border: 1px solid #111; transition: background .25s ease-in-out; -moz-transition: background .25s ease-in-out; -webkit-transition: background .25s ease-in-out; }

.checkbox-container input:checked~.checkmark { background-color: #2196F3; border: 1px solid #fff; }
.checkmark:after { content: ""; position: absolute; display: none; }
.checkbox-container input:checked~.checkmark:after { display: block; }
.checkbox-container .checkmark:after { left: 5px; top: 1px; width: 5px; height: 10px; border: solid white; border-width: 0px 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
/*body.compare-panel-open { overflow:hidden; }*/

.compare-panel { width:400px;position:absolute;bottom:0;right:10px; border-radius: 5px }
.compare-panel .title { color: #111; font-weight:700;font-size:14px;border:0;text-align:left;display:block;width:100%;padding:15px 15px; background: #fff; border: 1px solid #ddd; border-radius: 5px 5px 0px 0px; }
.compare-panel .title:focus{text-decoration:none; }
.compare-panel .title .icon { margin-right:10px; }
.compare-panel .title.collapsed .icon { transform: rotate(180deg); }
.compare-panel .title .badge { background: #f60; color: #fff; margin: 3px 0px 0px 0px; float: left; position: absolute; margin-left: 10px; }
.compare-panel .price strong, .compare-panel .price small { color: #000; }
.compare-panel .compare-product-list { background:#fff;float:left;width:100%;margin:0;padding:1px; border: 1px solid #fff; }
.compare-panel .compare-product-list li { float:left;border-bottom:1px solid #eee;position:relative;width:100%;padding:20px 50px 20px 20px; }
.compare-panel .compare-product-list li .image { margin-right:15px;float:left; }
.compare-panel .compare-product-list li .product-title { font-size:14px;color: #040404; margin-bottom:5px;font-weight:700; }
.compare-panel .compare-product-list li .price { font-size:14px; }
.compare-panel .remove-product{top:16px;right:10px;position:absolute; }
.compare-panel .btn-compare-products { clear:both;background:#fff;padding:15px 20px; }
.compare-panel-wrapper { width:100%;position:fixed;bottom:0;right:0;z-index:2; }

@media only screen and (max-width: 476px) {
    .compare-panel { width: 100%; position: fixed; left: 0px; z-index: 99!important; }
}

.compare .remove-product{top:0;right:0;position:absolute; }
.compare-overlay { width: 100%; height: 100%; background: #000000; opacity: 0.5; position: fixed; top: 0; left: 0; cursor: pointer; z-index: 2; }
.compare-table > tbody > tr > td { border-top:0; }
.compare-property td { border-bottom:1px solid #ddd;border-right:1px solid #ddd; }
.compare-property:last-child td { border-bottom:0; }
.compare-property td:last-child { border-right:0; }
.compare-property ul { list-style:none;padding:0; }
.compare-property li { margin:0; }
.page-body.compare .compare-product .checkbox-container { display: none; }
.page-body.compare .compare-product .remove-product .btn, .compare-panel .remove-product .btn { color: #000; padding: 6px 12px; }
.page-body.compare .compare-product .remove-product .btn:hover, .compare-panel .remove-product .btn:hover { color: #e10817; }
.compare-product .product { padding: 0px!important; }

.page-body.compare h3 { font-size: 21px; color: #e10817; font-weight: 800; }
.compare thead tr td { text-align: center; }
.page-body.compare .compare-product .ratings.small { float: none; }
.page-body.compare .compare-product .image { padding: 13px 0px 10px 0px; width: 100%; text-align: center; }
.page-body.compare .compare-product .image img { width: 100%; max-width: 180px; margin: 0px auto; }
.page-body.compare .compare-product .price { font-size: 16px; color: #111; display: block; }
.page-body.compare .compare-product .button { position: absolute; bottom: 20px; width: calc(100% - 60px); padding: 0px 12px; line-height: 45px; display: block; background: #272727; }
.page-body.compare .compare-product .price small { padding-left:8px;font-size:16px;color:#000; }
.page-body.compare .compare-product p { font-size: 14px;color:#111;line-height:21px; }
.page-body.compare .compare-product.active .link,.page-body.compare .compare-product:hover .link{text-decoration:underline; }
.page-body.compare .compare-products td { width:220px; }
.page-body.compare .compare-product { display:inline-block;position:relative;max-width:300px;text-align:left; }
.page-body.compare.compare-product .link { display:inline-block;font-size: 14px;color:#333;position:relative;padding:0 0 0 17px; }
.page-body.compare .compare-product .link:before { position:absolute;left:0;top:0;font-size: 14px;font-family:FontAwesome;content:"\f196"; }
.page-body.compare .scrolling table{table-layout:inherit; }
.page-body.compare .scrolling td { border-left:1px solid #ddd;border-top:1px solid #ddd; }
.page-body.compare .inner { overflow-x: auto; overflow-y: visible; margin-left: 165px; }
.page-body.compare .scrolling td,.page-body.compare .scrolling th { vertical-align:top;min-width:185px;max-width:230px;border-top:1px solid #ddd;padding:10px; margin: -1px; }
.page-body.compare .scrolling ul { list-style:none;padding:0; }
.page-body.compare .scrolling th {  position:absolute;left:0;width:165px; }
.page-body.compare .outer{ position:relative; }
.page-body.compare .scrolling thead tr th,.scrolling thead tr td { border:0; }
.page-body.compare .scrolling .image img { display:block;max-width:180px;height:auto; }
.datepicker table tr td span.new.disabled,.datepicker table tr td span.disabled,.datepicker table tr td span.disabled:hover { color:#eaeaea; }
.slick-slide .image a { display:block; }


/* Container for your new cross-sell title and subtitle */
.cross-sell-title {
    text-align: left;
    margin-bottom: 15px;
}

.cross-sell-title h3 {
    margin: 0 0 -4px 0;
    font-family: "DM Sans", sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #285dab;
    text-transform: uppercase;
    line-height: 1.3;
}

.cross-sell-title h4 {
    margin: 0;
    font-family: "Roboto Slab", serif;
    font-size: 14px;
    font-weight: 400;
    color: #0090e2;
    line-height: 1.5;
    float: none !important;
    position: static !important;
    width: auto !important;
}

.cross-sell {
    margin: 0px!important;
    padding: 0px!important;
}

.cart-offers { }

.cart-offers-title {
    font-family: "DM Sans", sans-serif;
    font-size:26px;
    font-weight:700;
    margin:30px 0 40px;
}

.cart-offers .nav.nav-tabs { box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1); }
.cart-offers .nav>li>a { margin-right:0;font-size:16px;border:0;border-radius:0;color:#969696;padding:13px 60px; }
.cart-offers .nav>li>a:hover,.cart-offers .nav>li>a:focus { background:none!important; }
.cart-offers .nav-tabs { border-bottom:1px solid #ddd; }
.cart-offers.r-tabs .r-tabs-tab.r-tabs-state-active { color:#fff;background:#ddd;border-bottom:2px solid #e10817; }
.cart-offers .tab-pane>.title { font-size:18px;font-weight:700;margin-top:20px; }
.cart-offers .tab-pane>.title .price { display:inline-block;font-size: 14px;font-weight:400;line-height:0.9;color:#fff;background-color:#111;border-radius:2px;border:1px solid #ddd;margin:0 0 0 10px;padding:8px 16px; }

.cart-offers .parts { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 20px; }
.cart-offers .parts li { width: calc((100% - (20px * 2)) / 3); box-sizing: border-box; border: 1px solid #ddd; border-radius: 5px; padding: 15px; display: flex; flex-direction: row; align-items: flex-start; }
.cart-offers .parts li .image-column { width: 82px; flex-shrink: 0; margin-right: 15px; }
.cart-offers .parts li .image-column .image { display: block; max-width: 100%; height: auto; }
.cart-offers .parts li .mobile-column { flex-direction: column; }
.cart-offers .parts li .mobile-column .popup-link:hover { text-decoration: underline; color: #111; }
.cart-offers .parts li .title-column { margin-bottom: 0px; }
.cart-offers .parts li .title-column .title { font-size: 14px; display: block; font-weight: 700; margin: 0 0 5px; color: #0090e2; line-height: 1.4; min-height: 37px; }
.cart-offers .parts li .title-column .title a { font-size: 14px; color: #0090e2; }
.cart-offers .parts li .title-column .btn { float: none; display: inline-block; font-size: 12px; }
.cart-offers .parts li .price-column { text-align: left; font-size: 16px; font-weight: bold; color: #333; margin-bottom: 0px; padding-top: 0; }
.cart-offers .parts li .price-column .price { white-space: nowrap; }
.cart-offers .parts li .price-column .price .discount { padding-left: 8px; color: #bebebe; font-weight: normal; text-decoration: line-through; font-size: 14px; }
.cart-offers .parts li .options-column { padding-left: 0; margin-top: auto; }
.cart-offers .parts li .options-column .add-to-cart-btn { display: inline-block; position: revert-layer; margin-left: 180px; margin-top: -70px; }
.cart-offers .parts li .title-column .title .part-label { display: inline-block; margin: 0 0 0 10px; padding: 8px 16px; font-size: 14px; line-height: 0.9; color: #fff; background-color: #ff6c00; border-radius: 2px; }
.cart-offers .part-selection-description { color: #111; padding: 32px 0; }
.cart-offers .part-selection-description p { color: #111; }
.discount .btn { margin-top: 5px; font-size: 14px; }
.offerBox-bottom { position: relative; margin-top: 0px; margin-bottom: 50px; margin-left: 0px; }

.top-20-px { margin-top: 20px; }
.min-height-170 { min-height: 170px!important; }

@media only screen and (max-width: 992px) { /* Tablets */
    .cart-offers .parts li {
        width: calc((100% - 20px) / 2); /* 2 cards per row */
    }
}

@media only screen and (max-width: 767px) {
    .cart-offers .parts li { width: 100%; align-items: left; }
    .cart-offers .parts li .options-column .add-to-cart-btn svg { margin-left: -14px; }
    .cart-offers .parts li .price-column .price { margin-left: 10px; }
    .top-50-px { margin-bottom: 20px; float: left; clear: both; }
    .top-20-px { margin-top: 20px; }

    .cart-offers .parts li .image-column {
        width: auto;
        max-width: 120px;
        margin-right: 0; 
        margin-bottom: 15px;
    }

    .cart-offers .parts li .mobile-column {
        align-items: center;
        text-align: center; 
        width: 100%;
    }

    .cart-offers .parts li .title-column {
        margin-bottom: 0px;
        text-align: left;
        margin-left: 10px; 
    }
    .cart-offers .parts li .title-column .title {
        display: block;
        margin:0px;
        margin-top: 20px;
    }
    .cart-offers .parts li .title-column .btn { /* "More information" button */
        display: inline-block;
        margin: 5px auto;
    }

    .cart-offers .parts li .price-column {
        text-align: left;
        margin-bottom: 0px;
        float: left;
        clear: both;
        margin-right: 158px;
    }

    .cart-offers .parts li .options-column {
        padding-left: 0;
        margin-top: 0;
    }
    .cart-offers .parts li .options-column .add-to-cart-btn {
        float: right;
        position: static;
        margin-top: -50px;
        margin-left: 190px;
    }
    
    .add-to-cart-btn svg {
        width: 24px;
        height: 24px;
        fill: #fff;
        margin-right: 30px;
        margin-left: -4px;
    }
    
    .popup-link { 
        margin-left: 10px;
        float: left;
    }
}

@media only screen and (max-width: 320px) { 
    .cart-offers .parts li .title-column .title {
            max-width: 100px;
        }
}

@media only screen and (max-width: 390px) { /* Mobile */
    .cart-offers .parts li .options-column .add-to-cart-btn {
        margin-left: 140px;
    }
}

.info-box-ambilight { background-color: #f9f9f9; border: 1px solid #e0e0e0; border-radius: 5px; padding: 30px; margin-top: 20px; margin-bottom: 30px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.07); line-height: 1.65; font-family: sans-serif; }
.info-box-ambilight h4 { margin-top: 0; margin-bottom: 15px; font-size: 1.4em; color: #1a1a1a; }
.info-box-ambilight ul { list-style-type: none; padding-left: 0; margin-top: 20px; }
.info-box-ambilight li { position: relative; padding-left: 35px; margin-bottom: 12px; color: #444; }
.info-box-ambilight li::before { content: '✓'; position: absolute; left: 0; top: 4px; color: #28a745; font-weight: bold; font-size: 20px; line-height: 1; }
.info-box-ambilight li:last-child { margin-bottom: 0; }
.video-kontejner { position: relative; overflow: hidden; width: 100%; padding-top: 56.25%; margin-top: 20px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); }
.video-kontejner iframe { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; border: none; }

.informationBox .rate-pay-banner { width:100%;max-width:190px;padding:10px; }
.informationBox .rate-pay p,.gamedetailBox .rate-pay p { font-size: 14px;color:#333;margin:0 0 5px; }
.informationBox .rate-pay a,.gameBox .total .rate-pay a,.gridBox .price .rate-pay a,.featured-set .composeBox .price .rate-pay a,.gamedetailBox .rate-pay a { font-size: 14px;color:#333;text-decoration:underline; }

.category-tips {
    margin-top: 20px;
    padding: 20px;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    border-radius: 6px;
    opacity:0;
    transform: translateY(-10px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.category-tips.visible {
    opacity: 1;
    transform: translateY(0px);
}


.tip-section { }

.tip-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #333;
    padding: 10px;
    background-color: #fff;
    border-radius: 4px;
    border: 1px solid #ccc;
    transition: background 0.3s;
}

.tip-header:hover {
    background-color: #f0f0f0;
}

.tip-header i {
    transition: transform 0.3s ease;
}

.tip-content {
    display: none;
    margin-top: 10px;
    animation: slideDown 0.4s ease forwards;
}

.tip-content.open {
    display: block;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tip-content p {
    font-size: 14px;
    margin-bottom: 10px;
    color: #444;
}

.tip-content ul {
    list-style: none;
    padding-left: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.tip-content li {
    display: inline-block;
}

.tip-content a {
    display: inline-block;
    padding: 6px 12px;
    background-color: #fff;
    color: #007BFF;
    border: 1px solid #007BFF;
    border-radius: 4px;
    text-decoration: none;
    font-size: 14px;
    transition: 0.3s;
}

.tip-content a:hover {
    background-color: #007BFF;
    color: #fff;
}

.microfin-info-box {
    margin-top: 10px;
    font-size: 14px;
    overflow: hidden;
}

.microfin-info-box .info-header {
    background: #e2f0ff;
    padding: 12px 15px;
    cursor: pointer;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.microfin-info-box .info-header i {
    transition: transform 0.3s ease;
}

.microfin-info-box.open .info-header i {
    transform: rotate(180deg);
}

.microfin-info-box .info-content {
    /*padding: 15px;*/
    /*display: none;*/
}

.microfin-info-box.open .info-content {
    display: block;
}

.microfin-btn {
    display: inline-block;
    padding: 6px 12px;
    background-color: #fff;
    color: #007BFF!important;
    border: 1px solid #007BFF;
    border-radius: 4px;
    text-decoration: none;
    font-size: 14px;
    transition: 0.3s;
}

.microfin-btn:hover {
    background-color: #007BFF!important;
    color: #fff!important;
    text-decoration: none!important;
}


.microfin-info-box li {
    list-style: circle;
    margin-left: 18px;
}


.microfin-btn:hover {
    background-color: #004d99;
}

.no-padding-left { margin-left: 0px!important; width: 100%!important; }
.no-padding-left p { margin-top: -10px!important; }
p.no-p-margin { margin-top: -7px!important; }

/* Wrapper sekcija */
.tv-size {
  /*margin-bottom: 15px;*/
}

.tv-size h3 {
  font-size: 14px !important;
  color: #111;
  margin-bottom: 10px;
}

.tv-size h3 a {
  font-size: 14px !important;
  color: #111;
  text-decoration: none;
}

.tv-size h3 a:hover {
  opacity: 0.8;
  text-decoration: none;
  color: #111;
}

/* Lista veličina */
.tv-size-selector {
  display: flex;
  gap: 10px;
  padding: 0;
  list-style: none;
  margin: 0;
  margin-bottom: 10px;
  /*padding-bottom: 10px;*/
}

/* Svaka opcija */
.size-option a {
    display: block;
    padding: 7px 14px;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-decoration: none;
    color: #111 !important;
    background-color: #fff;
    transition: all 0.2s ease;
    font-size: 13px !important;
    font-weight: normal;
}

.size-option a:hover {
  border-color: #999;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

/* Aktivni link */
.size-option.active a {
    border-color: #0090e2 !important;
    border: 2px solid #0090e2;
    background-color: #f2f7fc;
    color: #111;
    font-weight: bold;
}

/* --- Custom Tooltip for Size Selector --- */

/* 1. Prepare the container */
/* This makes the list item a positioning parent for the tooltip. */
.tv-size-selector .size-option {
  position: relative;
}

/* 2. Style the tooltip using your existing class as a base */
.size-option .popular-tooltip {
    display: none;
    position: absolute;
    top: 100%;
    margin-top: 3px;
    left: 167%;
    transform: translateX(-50%);
    background-color: #fff;
    color: #333;
    padding: 12px;
    border-radius: 6px;
    width: 170px;
    z-index: 1000;
    font-size: 13px;
    line-height: 1.4;
    text-align: left;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

/* 3. Style the arrow (also from your code) */
.size-option .popular-tooltip::after {
  content: '';
  position: absolute;
  bottom: 100%; /* Place arrow at the top of the tooltip box */
  left: 10%;
  transform: translateX(-50%);
  border-width: 8px;
  border-style: solid;
  border-color: transparent transparent #fff transparent; /* Points up */
}

/* 4. The Magic: Show the tooltip on hover (pure CSS) */
.size-option.not-available:hover .popular-tooltip {
  display: block;
}

/*
  Add or replace this in your style.css file.
  This version creates a custom diagonal line-through effect.
*/
.tv-size-selector .size-option.not-available a {
  /* --- Core Disabled Styles --- */
  opacity: 0.7;                   /* Fades out the button */
  pointer-events: none;           /* Makes the link unclickable */
  cursor: not-allowed;            /* Shows a "not allowed" cursor */
  color: #aaa;                     /* Fades the text color */
  text-decoration: none;          /* IMPORTANT: Remove the old line-through */
  position: relative;             /* Allows us to position the line on top */
  display: inline-block;          /* Ensures position:relative works consistently */
}

/* This ::after pseudo-element IS the diagonal line */
.tv-size-selector .size-option.not-available a::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: block;
    content: "";
    background-image: linear-gradient(to bottom right, hsl(0deg, 0%, 69%) 25%, transparent 25%, transparent 50%, hsl(0deg, 0%, 69%) 50%, hsl(0deg, 0%, 69%) 75%, transparent 75%, transparent);
    background-size: 4px 4px;
    opacity: .5;
}

@media only screen and (max-width: 320px) {
    .size-option a {
        padding: 7px 10px;
    }

}

.gamedetailBox .image { position:relative;border:1px solid #ddd;padding:5px; }
.gamedetailBox .image .dottedSlider .slick-dots{bottom:0;margin:0 0 20px; }
.gamedetailBox .image .dottedSlider .slick-dots li { height:auto;width:auto;margin:0; }
.gamedetailBox .image .dottedSlider .slick-dots li button{ position:relative;height:13px;width:13px;margin:0 2px; }
.gamedetailBox .image .dottedSlider .slick-dots li button:before { content:'';width:100%;height:100%;border:1px solid #ddd;opacity:1; }
.gamedetailBox .image .dottedSlider .slick-dots li.slick-active button:before { background:#fbfbfb;border:1px solid #c6c6c6;opacity:1; }
.gamedetailBox .image .dottedSlider .slide { display:block;width:100%;padding:17px 15px; }
.gamedetailBox .image .dottedSlider>.slide:not(.active) { display:none; }
.gamedetailBox .image .dottedSlider .slide img { display:block;width:100%;max-width:315px;height:auto;margin:auto; }
.gamedetailBox .detail { width:100%;overflow:hidden;border:1px solid #ddd; background:#fff; border-radius:5px; }
.gamedetailBox .detail .text { min-height:120px;overflow:hidden;border-bottom:1px solid #ddd;padding:22px 25px 10px; }
.gamedetailBox .detail .text strong { font-size:18px;display:block; }
.gamedetailBox .detail .text p { font-size: 14px;color:#333;line-height:21px; }
.gamedetailBox .content p { font-size: 14px;color:#333;margin:0;padding:10px 0 0; }
.gamedetailBox .content h2 { font-size:20px;margin:0; color: #285dab; font-weight: 700; font-family: "Roboto Slab", serif; margin-bottom: 10px; }
.gamedetailBox .content { border-bottom:1px solid #ddd;padding:20px; }
.gamedetailBox .content .form-control { width:56px;height:40px;text-align:center;margin-right:13px;border:1px solid #ddd;border-radius:2px;float:left; }
.gamedetailBox .detail .popular-badge-wrapper { margin-bottom: 10px; }


h2.popuph2 { margin: 0; font-size: 18px!important; font-weight: 400!important; color: #0090e2!important; font-family: "Roboto Slab", serif; }

.gamedetailBox .content .product-specs {
    padding: 0;
    margin-top: 20px;
    margin-bottom: 0px;
    font-size: 14px;
    color: #333;
    line-height: 17px;
    list-style-type: disc;
    padding-left: 15px;
    clear: both;
    /*padding-top: 10px;*/
}

.gamedetailBox .content .product-specs li {
    margin-bottom: 3px;
    list-style-type: disc;
    color:#666;
}


.gamedetailBox .content .product-specs span {
        border-bottom: 1px dashed;
        cursor: default;
}

.gamedetailBox .detail .logo-firme img { 
    max-width: 90px;
    max-height: 80px;
    margin-bottom: 15px; 
}
.gamedetailBox .price strong { font-size:24px;color:#111; text-transform:uppercase; font-weight: 900; }
.gamedetailBox .price small { font-size:16px;color:#a2a2a2;font-weight:200; text-transform:uppercase; }
.gamedetailBox .price span {     
    font-size: 13px;
    display: block;
    line-height: 14px;
    padding: 0 0 10px;
    color: #bfbfbf; }

.gamedetailBox img.mikrofin { 
    border: none;
    float: left;
    max-width: 100px;
    margin-left: 10px;
    background: none;
    margin-top: -1px;
}
.gamedetailBox .rating a { color:#fff;text-decoration:underline;font-size: 14px; }
.gamedetailBox .rating p { font-size: 14px;color:#333;float:left;margin:-9px 0 0;padding:0 0 0 4px; }
.gamedetailBox .ratings { margin:0px; }
.gamedetailBox .upsblock { border:none; padding: 0px 0px 20px 20px; }
.gamedetailBox .upsblock li { line-height:24px; }
.gamedetailBox .order { padding:0px; }
.gamedetailBox .product-title h1 { padding-bottom:8px;font-size:28px;font-weight:700;margin:0; }
.gamedetailBox .product-title .rating{line-height:44px;overflow:hidden;padding:0 0 11px; }
.gamedetailBox .product-title .rating .ratings { float:left;width:auto;margin:0;padding:0; }
.gamedetailBox .detail .right { font-size: 14px;width:50%;float:left;padding:26px 0 20px 25px; }
.gamedetailBox .detail .left { width:50%;float:left;border-right:1px solid #ddd; }
.gamedetailBox .beschikbaar-check { font-size:16px;padding:0 5px; }
.gamedetailBox .right p { margin:0; }
.gamedetailBox h1 { font-size: 26px; color: #285dab; font-weight: 700; font-family: "Roboto Slab", serif; margin:15px 0px 5px 0px; padding:0px; }
.review h3.review-title { font-size: 20px; color: #285dab; font-weight: 700; font-family: "Roboto Slab", serif; margin:0px 0px 15px 0px; padding:0px; }
.gamedetailBox h2,.gamedetailBox h3 { font-weight:700;font-size:20px; }
.gamedetailBox .productSliderVertical { overflow: hidden; }
.gamedetailBox h4,.gamedetailBox h5 { font-weight:700;font-size:18px; color:#0090e2; }
.gamedetailBox p { color:#111; font-size: 14px; line-height: 22px; }
.gamedetailBox a { color:#f60; font-size: 14px; }
.gamedetailBox a:hover { color:#f60; text-decoration: underline; }
.gamedetailBox .review-title { clear:both; }
.gamedetailBox .more-specs { margin-bottom:20px;clear:both;border:1px solid #ddd;padding:10px; font-size: 14px; border-radius: 5px; color:#0090e2; }
.gamedetailBox .more-specs:hover { text-decoration: underline; color:#0090e2; }
.gamedetailBox .reviews-all { float:left;clear:both;width:100%; }
.gamedetailBox #review-list { overflow: hidden; border: 1px solid #ddd; padding: 15px 15px 0px 15px; margin-bottom: 10px; border-radius: 5px;  }
.gamedetailBox #review-list ul li::before { list-style: none !important; margin: 0px !important; content: ""; }
.gamedetailBox #review-list h4 { margin-bottom: 0px; }
.gamedetailBox .reviews-all .all-reviews-btn { margin-top: 10px; color: #111; border-radius: 5px; }
.gamedetailBox .reviews-all h3 { font-size: 18px; color:#285dab; }
.gamedetailBox .reviews-all h4 { padding: 0px; margin: 0px 0px 14px 0px; }
.gamedetailBox .reviews-all h5  { padding: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 14px 0px; }
.gamedetailBox .reviews,.gamedetailBox .reviews .reviews-text{vertical-align:middle; }
.gamedetailBox .reviews .rating { display:inline-block;margin-right:.625rem; }
.gamedetailBox .reviews a { text-decoration:underline; }
.gamedetailBox .order .btn { margin-bottom:.9375rem; border-radius: 5px; font-size: 15px; font-weight: 700; box-shadow: inset 0 -2px 0 0 #090; min-height: 45px; }
.gamedetailBox .order-form { position:relative; padding: 20px 20px 0px 20px; }
.gamedetailBox .order .btn:after { display: block; width: 0.5rem; height: 0.875rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; top: 50%; right: -40%; width: 100%; }
.gamedetailBox .cart-icon-wrapper {
    margin-left: auto;
    display: flex;
    align-items: center;
    float: right; 
}
.gamedetailBox .cart-icon {
    width: 24px;
    height: auto;
    fill: white;
}
.gamedetailBox .akcija-product {
    position: absolute;
    margin-left: 156px;
    margin-top: -121px;
}
.gamedetailBox .label {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 14px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60;
    display: inline-block;
    padding: .2rem .4rem .4rem;
}
@media only screen and (max-width: 479px) {
    .gamedetailBox .label {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: "Roboto Slab", serif;
        font-weight: 900;
        font-size: 14px;
        line-height: 24px;
        background-color: #fef1e8;
        border-radius: 5px;
        color: #f60;
        display: inline-block;
        padding: 3px 10px 5px 10px;
        margin-left: 15px;
    }
}

.prednosti-mane-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
    margin-top: 00px;
}

.prednosti,
.mane {
    flex: 1 1 35%;
    box-sizing: border-box;
}

.prednosti {
    background-color: #fff;
    font-family: Arial, sans-serif;
    color: #333;
    margin-top: 15px;
}

.prednosti h4 {
    font-size: 14px;
    color: #111;
    font-weight: 500;
    font-family: "Roboto Slab", serif;
    margin: 0px 0px 15px 0px;
    padding: 0px;
    padding-bottom: 5px;
}

.prednosti p {
    margin: 0px 0;
    padding-left: 20px;
    position: relative;
}

.prednosti p::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 17px;
    height: 17px;
    background-image: url("data:image/svg+xml;utf8,<svg fill='black' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'><path d='M220,128a4,4,0,0,1-4,4H132v84a4,4,0,0,1-8,0V132H40a4,4,0,0,1,0-8h84V40a4,4,0,0,1,8,0v84h84A4,4,0,0,1,220,128Z'/></svg>");
    background-repeat: no-repeat;
    background-size: 17px 17px;
    display: inline-block;
}

.mane {
    background-color: #fff;
    font-family: Arial, sans-serif;
    color: #333;
    margin-top: 15px;
}

.mane h4 {
    font-size: 14px;
    color: #111;
    font-weight: 500;
    font-family: "Roboto Slab", serif;
    margin: 0px 0px 15px 0px;
    padding: 0px;
    padding-bottom: 5px;
}

.mane p {
    margin: 0px 0;
    padding-left: 20px;
    position: relative;
}

.mane p::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 17px;
    height: 17px;
    background-image: url("data:image/svg+xml;utf8,<svg fill='black' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'><path d='M124,132H40c-2.2,0-4-1.8-4-4s1.8-4,4-4h84'/><path d='M124,124h92c2.2,0,4,1.8,4,4s-1.8,4-4,4h-92'/></svg>");
    background-repeat: no-repeat;
    background-size: 17px 17px;
    display: inline-block;
}

span.category-image-left {
    float: left;
    width: 50px;
    padding-top: 0px;
    display: inline-block;
    margin-right: 8px;
    vertical-align: middle;
    margin-bottom: -10px;
}
.category-image-left img {
    display: block;
}
.gamedetailBox .akcija-product-bottom {
    position: absolute;
    margin-left: 300px;
    margin-top: 0px;
}

@media only screen and (max-width: 479px) {
    .gamedetailBox .akcija-product-bottom {
        position: absolute !important;
        margin-left: 89px !important;
        margin-top: 0px!important;
    }
}

/*
 * ===============================================
 * Final Corrected CSS for the Brand Logo Slider
 * ===============================================
 */

/* Main container for the slider */
.brand-slider-category-container {
    position: relative;
    padding: 10px 0;
    margin: 10px 0px 0px 0px;
}

/* Ensure the swiper-wrapper has a transition for the sliding effect */
.brand-slider-category .swiper-wrapper {
    transition-timing-function: ease-in-out;
}

.brand-slider-category .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    padding-bottom: 15px;
    padding-top: 15px;
}

/* Style for the logo card inside each slide */
.brand-logo-category-button {
    display: block;
    width: 100%;
    max-height: 70px;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in-out;
}

.brand-logo-category-button:hover {
    border-color: #0090e2;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    transform: translateY(0px);
}

/* The container for the default and hover images */
.brand-image-category-fitter {
    aspect-ratio: 16 / 7;
    display: flex;
    align-items: center;
    justify-content: center;
}

.brand-image-category-fitter img {
    max-width: 60%;
    max-height: 21%;
    height: auto;
    width: auto;
    object-fit: contain;
    transition: opacity 0.3s ease;
}

img.brand-logo-category-default.bigger {
    min-height: 70px;
    min-width: 80px;
}

img.brand-logo-category-hover.bigger {
    min-height: 70px;
    min-width: 80px;
}

/* Logic for the image swap on hover */
.brand-logo-category-hover {
    display: none;
}

.brand-logo-category-button:hover .brand-logo-category-default {
    display: none;
}

.brand-logo-category-button:hover .brand-logo-category-hover {
    display: block;
}


.brand-swiper-button-next-category,
.brand-swiper-button-prev-category {
    position: absolute;
    top: 54%;
    transform: translateY(-40%);
    width: 40px;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    transition: background-color 0.3s ease;
    z-index: 10;
    --swiper-navigation-color: #333333;
    --swiper-navigation-size: 18px;
}

.brand-swiper-button-next-category:hover,
.brand-swiper-button-prev-category:hover {
    background-color: #f7f7f7;
}

/* Positioning for the arrows on desktop */
.brand-swiper-button-prev-category {
    left: -20px;
}

.brand-swiper-button-next-category {
    right: -20px;
}

/* --- FIX: Adjust arrows for mobile screens --- */
@media (max-width: 767px) {
    .brand-swiper-button-next-category,
    .brand-swiper-button-prev-category {
        /* Make arrows smaller on mobile */
        width: 30px;
        height: 30px;
        /* Adjust icon size */
        --swiper-navigation-size: 14px;
    }

    /* Reposition arrows to be closer to the edge */
    .brand-swiper-button-prev-category {
        left: -5px;
    }

    .brand-swiper-button-next-category {
        right: -5px;
    }
}


@media (max-width: 476px) {
    .brand-slider-category-container {
        position: relative;
        padding: 10px 0;
        margin: 10px 10px 10px 10px;
    }
    .brand-image-category-fitter {
        aspect-ratio: 5 / 2;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .brand-image-category-fitter img {
        max-width: 30%;
        max-height: 10%;
        height: auto;
        width: auto;
        object-fit: contain;
        transition: opacity 0.3s ease;
    }
}

/* Style for disabled arrows */
.swiper-button-disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.color-selector-wrapper h4 { color:#111; font-size: 14px; font-weight: 700; }
.color-selector-wrapper.top-50 { margin-top: 30px; margin-bottom: -30px; }
button.cmfBtn { width: 40px; border: none; background: #fff; }

.gamedetailBox .time { border-top:1px solid #ddd;position:relative}
.gamedetailBox .time span{width:51px;border-right:1px solid #ddd;display:block;font-size:27px;color:#f0f0f0;float:left;text-align:center;line-height:65px}
.gamedetailBox .time:before { content: ''; height: 100%; display: block; width: 3.3125rem; border-right: 1px solid #ddd; position: absolute; top: 0; left: 0; background-image: url(/game_computer_store/img/clock.svg); background-position: center; background-repeat: no-repeat; background-size: 1.4375rem 1.4375rem; }
.gamedetailBox .time p { padding: 10px 5px; margin: 0px 0px 0px 60px; font-size: 13px; color: #111; line-height: 22px; float: left; width: calc(100% - 51px); }
.gamedetailBox .offerBox .order { border: 0px; }
.gamedetailBox .rate-pay { margin-top: 0px!important; margin-left: 155px; position: absolute; text-transform: uppercase; min-width: 205px; text-align: center; padding: 0px; }
.gamedetailBox .rate-pay p { margin-top: 0px; font-size: 12px; text-transform: none!important; float: right; margin-right: 20px; }
.gamedetailBox .rate-pay-banner { width:100%;max-width:190px;padding:10px; }
.gamedetailBox li.ok{display:flex;align-items:center;grid-gap:12px;gap:7px;position:relative;font-size: 14px;font-weight:bold;line-height:30px; color:#00b900; padding-top: 28px; margin-top: 20px; }
.gamedetailBox li.ok:before{content:"";display:block;width:10px;height:10px;background:#00b900;border-radius:50%}
.gamedetailBox h6, .review h6 { margin: 0; font-size: 18px; font-weight: 700; color: #0090e2; font-family: "Roboto Slab", serif;}
.gamedetailBox .specifikacije { position:relative;width:100%;padding:20px;border:1px solid #ddd;position:relative;border-radius:5px; margin-top: 20px; }
.gamedetailBox .order .usps { padding: 0px 0px 20px 15px; }
.gamedetailBox .main-product { width: 60% !important; }

.mikrofin-product {
    width: 90%;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 20px;
    margin: 0px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    background-color: #fff;
    margin-left: 20px;
    max-height: 45px;
    margin-bottom: 10px;
}

span.mikrofin-info { padding-top: 9px; }

svg.mikrofin-info {
    width: 20px;
    height: 20px;
    fill: #3A3A3A;
    margin-left: 280px;
}

.mikrofin-product.bottom-mikrofin {
    margin-left: 0px;
}

.mikrofin-product a {
    margin: -25px 0px 10px 1px; 
}

.mikrofin-product .rate-pay {
    display: flex;
    align-items: center;
    gap: 10px;
    border: none;
    background: none !important;
    margin: 0px !important;
}

.mikrofin-product .price-month {
    font-weight: bold; 
    text-transform: uppercase!important;
}


.mikrofin-product .rate-pay img.mikrofin {
    width: 100px;
    height: auto;
    display: block;
}

.mikrofin-product .rate-pay p {
    margin: 0;
    font-size: 13px;
    color: #333;
    font-weight: 500;
}


.mikrofin-category {
    margin-top: 8px;
    /*background-color: #f4f8f5;*/
    border: 1px solid #d3e8dc;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 13px;
    color: #2a4832;
    display: inline-block;
    margin-bottom: 10px;
}

.mikrofin-category p {
    margin: 0;
    line-height: 1.4;
    font-size: 12px;
    text-transform: none:
    
}

.mikrofin-category .price-month {
    font-weight: bold;
    color: #1a7b43;
    text-transform: uppercase;
}

@media only screen and (max-width: 320px) {
    .mikrofin-product .rate-pay img.mikrofin {
        width: 60px;
        height: auto;
        display: block;
    }
    span.sifra.mob { display: none; } 
    svg.mikrofin-info { margin-left: 180px !important; }
}

@media only screen and (max-width: 476px) {
    svg.mikrofin-info {
        margin-left: 250px;
    }
}


.popular-badge-wrapper {
    display: flex;
    align-items: center;
    margin: 0px;
    font-family: "DM Sans", sans-serif; 
}

.popular-badge-wrapper.home {
    display: flex;
    align-items: center;
    margin: 10px 0;
    font-family: "DM Sans", sans-serif; 
    position: absolute;
    margin-top: 170px;
    margin-left: 103px;
}

@media only screen and (max-width: 479px) {
    
    .popular-badge-wrapper {
        margin-bottom: 5px;
    }
    .popular-badge-wrapper.home {
        margin-top: 145px!important;
        margin-left: 80px;
    }
}

.popular-badge-styled {
    display: inline-flex;
    align-items: center;
    background-color: #fef3e1;
    border-radius: 16px;
    padding: 5px 10px;
    border: 1px solid #fdebc8;
}

.popular-badge-icon svg, span.popular-badge-icon {
    width: 16px;
    height: 16px;
    margin-right: 8px;
    fill: rgb(179, 89, 0);
    padding: 0px!important;
}

.popular-badge-text, span.popular-badge-text {
    color: #b35900!important;
    font-size: 13px!important;
    font-weight: 600 !important;
    line-height: 18px !important;
    padding: 0px !important;
    margin: 0px !important;
}

/* Novi kontejner za 'i' ikonu koji omogućava pravilno pozicioniranje */
.info-icon-wrapper {
    position: relative; /* Ključno za pozicioniranje tooltip-a */
    margin-left: 8px;
}

.popular-info-button {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.popular-info-button svg {
    width: 20px;
    height: 20px;
    fill: #3A3A3A;
}

/* AŽURIRANI TOOLTIP */
.popular-tooltip {
    display: none;
    position: absolute;
    /* Pozicioniranje ISPOD ikone */
    top: calc(100% + 12px); /* 100% visine roditelja + 12px razmaka */
    left: 50%;
    transform: translateX(-50%); /* Centriranje tooltip-a */
    background-color: #fff;
    color: #333;
    padding: 12px;
    border-radius: 6px;
    width: 180px;
    z-index: 100;
    font-size: 13px;
    line-height: 1.4;
    text-align: left;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* AŽURIRANA STRELICA (sada pokazuje GORE) */
.popular-tooltip::after {
    content: '';
    position: absolute;
    bottom: 100%; /* Postavlja se na vrh tooltip-a */
    left: 50%;
    transform: translateX(-50%);
    border-width: 8px;
    border-style: solid;
    /* Boja definira trokut koji pokazuje prema gore */
    border-color: transparent transparent #fff transparent;
}

/* Pravilo za prikaz ostaje isto, ali sada radi unutar novog kontejnera */
.info-icon-wrapper:hover .popular-tooltip,
.popular-info-button:focus + .popular-tooltip {
    display: block;
}

span.besplatno-cart-item { 
    color: #00b200;
    font-weight: bold;
    font-size: 14px;
    text-transform: capitalize!important;
}

span.sifra { font-size: 12px; line-height: 14px; padding: 0 0 10px; color:#bfbfbf; }
span.sifra.desktop { float: right; margin-top: 0px; }
span.sifra.mob { float: right; margin-top: -34px; }
.cijena { margin-top: -6px; font-size: 12px; }
span.pdv { margin-top: -6px; font-size: 12px; }

@media only screen and (max-width: 479px) {
    .gamedetailBox { margin-top: 50px; }
    .gamedetailBox .order { border:none; padding-bottom: 0px; padding: 0px; clear: both; }
    .gamedetailBox .content { border:none; padding-bottom: 0px; }
    .gamedetailBox .content h5 { margin: 0; font-size: 16px; font-weight: 400; color: #0090e2; font-family: "Roboto Slab", serif; float: left; margin-bottom: 10px; }
    .gamedetailBox .no-padding { padding: 0px 0px 10px 0px !important; }
    .gamedetailBox .detail { margin-bottom: 10px!important; margin-top: -10px; }
    .gamedetailBox ul.skladiste { 
        float: left;
        clear: both;
        margin-top: -42px;
        position: absolute;
        
    }
    .gamedetailBox .price { margin-top: 10px; }
    .gamedetailBox .uporedi { width: 100%; padding-bottom: 10px; padding-top: 30px; }
    .gamedetailBox .specifikacije { margin-top: 20px; }
    .usps { margin-bottom: 10px; }
    .gamedetailBox .time { float: none; width: 100%; }
    .gamedetailBox .main-product { display: none; }
    .product-actions .usps, .usps { display: none; }
    .gamedetailBox .order-form, .gamedetailBox .order .usps { padding: 0px; }
    .mobile-padding-20 { padding: 20px!important; margin-bottom: -20px; }
    .gamedetailBox .akcija-product {         
        position: absolute;
        margin-left: 90px;
        margin-top: -46px!important;
    }
}
@media only screen and (min-width: 479px) {
    .gamedetailBox .hide-xl { display: none; }
    .gamedetailBox ul.skladiste {
        float: right;
        position: absolute;
        margin-left: 0px;
        margin-top: -50px;
    }
    .gamedetailBox .price { margin-top: 10px; }
    .gamedetailBox .uporedi { width: 100%; padding-bottom: 10px; padding-top: 30px; }
}
@media only screen and (max-width: 767px) {
    .gamedetailBox .image .dottedSlider .slide img { max-width:400px; }
    .gamedetailBox .detail .left { width:100%;border-right:0; margin-top: -80px; }
    .parts .slick-slider .slick-track,.parts .slick-slider .slick-list{ margin-bottom:50px; }
    .gamedetailBox .detail .right { width:100%; padding: 0px; }
    .gamedetailBox .time { float: none; width: 100%; }
}
@media only screen and (min-width: 767px) {
    .gamedetailBox .detail { margin-top: 0px; min-height: 480px; }
    /*.gamedetailBox .reviews,.gamedetailBox .reviews .reviews-text, .gamedetailBox .navigation-head { max-width: 50%; }*/
}

.gamedetailBox .uporedi { width: 100%; padding-bottom: 10px; }
.gamedetailoptionBox { width: 100%; }
.gamedetailoptionBox .head { margin-bottom:16px;overflow:hidden;width:100%;border:1px solid #ddd;padding:21px; }
.gamedetailoptionBox .head h3 { font-size:20px;color:#333;font-weight:700;margin:0; }
.gamedetailoptionBox .head span { display:inline-block;font-size: 14px;font-weight:400;padding:0 0 0 20px; }
.gamedetailoptionBox .radioBox { margin-bottom:16px;position:relative;overflow:hidden;width:100%;border:1px solid #ddd;padding:21px 17px 20px 70px; }
.gamedetailoptionBox .radioBox:hover { box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1); }
.gamedetailoptionBox .radioBox strong { margin-bottom:5px;display:block;font-size:16px;color:#333; }
.gamedetailoptionBox .radioBox p { font-size: 14px;color:#333;line-height:21px; }
.gamedetailoptionBox .radioBox ul { margin-bottom:20px;overflow:hidden;list-style:none; }
.gamedetailoptionBox .radioBox li { width:33.3%;float:left;line-height:26px; }
.gamedetailoptionBox .radioBox li label { padding: 2px; }
.gamedetailoptionBox .radio span { display: inline-block; cursor: pointer; position: relative; padding-left: 25px; margin-right: 15px; font-size: 14px; color: #000000; }
.gamedetailoptionBox .radio input[type=radio] { display: none; }
.gamedetailoptionBox .radio span:before { font-family: 'FontAwesome'; content: "\f10c"; display: inline-block; font-size: 19px; color: #a8a8a8; margin-right: 10px; position: absolute; left: 0; top: 0px; border-radius: 100%; }
.gamedetailoptionBox .radio input[type=radio]:checked+span:before { font-family:FontAwesome;content:"\f192"; }
.gamedetailoptionBox .radioBox .on { width:37px;height:22px;display:block;position:absolute;left:22px;top:22px;background:url(/game_computer_store/img/on.png) left top no-repeat; }
.gamedetailoptionBox .radioBox .off { width:37px;height:22px;display:block;position:absolute;left:22px;top:22px;background:url(/game_computer_store/img/off.png) left top no-repeat; }
.gamedetailoptionBox .select{ position:relative;width:403px;height:48px;display:block;float:left; }
.gamedetailoptionBox .select select { width: 100%; padding: 0 5px; height: 48px; color: #333333; margin: 0; font-size: 14px; border: 1px solid #ddd; outline: none; display: inline-block; cursor: pointer; background: #fff; -webkit-appearance: none; -moz-appearance: none; }
.gamedetailoptionBox .select:after { font-family: 'FontAwesome'; font-size: 30px; content: "\f107"; background: #fff; width: 48px; height: 46px; line-height: 48px; text-align: center; border-left: 1px solid #ddd; position: absolute; top: 1px; right: 1px; pointer-events: none; }
.gamedetailoptionBox .radioBox.shadow { box-shadow: 1px 0px 5px 0px rgba(0, 0, 0, 0.2); }
.gamedetailoptionBox .radioBox small { font-size: 14px; }
.gamedetailoptionBox .checkbox span { display:inline-block;cursor:pointer;position:relative;padding-left:25px;margin-right:15px;font-size: 14px;color:#000; }
.gamedetailoptionBox .checkbox input[type=checkbox] { display: none; }
.gamedetailoptionBox .checkbox span:before { font-family: 'FontAwesome'; content: "\f10c"; display: inline-block;  font-size: 19px; color: #a8a8a8; margin-right: 10px; position: absolute; left: 0; top: 0px; border-radius: 100%; }
.gamedetailoptionBox .checkbox input[type=checkbox]:checked+span:before { font-family:FontAwesome;content:"\f192"; }

.nas-izbor-category img { 
    position: absolute;
    margin-top: -10px;
    margin-left: -6px;
    max-width: 70px !important;
}

.nas-izbor-category .content-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}


/* Ensures the image badge doesn't shrink. */
.nas-izbor-category .image-container {
    flex-shrink: 0;
}

/* Sets a fixed height for the image badge. */
.nas-izbor-category .badge-image {
    height: 3rem; /* 48px */
}

/* Styling for the main headline, e.g., "LaptopShop.ba Izbor" */
.nas-izbor-category .choice-text {
    font-weight: 700; /* bold */
    color: rgb(31 41 55); /* text-gray-800 */
    font-size: 1rem; /* 16px */
    line-height: 1.5rem; /* 24px */
    margin-bottom: 0px; /* 4px */
}

/* Styling for the new description text. */
.nas-izbor-category .choice-description {
    font-size: 0.875rem; /* 14px */
    line-height: 1.25rem; /* 20px */
    color: rgb(75 85 99); /* text-gray-600 */
    margin-bottom: 0px; /* 8px */
}

/* Styling for the link, e.g., "Pogledajte zašto" */
.nas-izbor-category .show-more-link {
    display: flex;
    align-items: center;
    gap: 0.25rem; /* 4px */
    color: rgb(37 99 235); /* text-blue-600 */
    font-weight: 600; /* semibold */
    font-size: 0.875rem; /* 14px */
    text-decoration: none;
    transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.nas-izbor-category .show-more-link:hover {
    color: rgb(30 64 175); /* hover:text-blue-800 */
}

/* Styling for the arrow icon within the link. */
.nas-izbor-category .arrow-icon {
    height: 1rem; /* 16px */
    width: 1rem; /* 16px */
}



@media only screen and (max-width: 479px) {
    .nas-izbor-home {
        position: absolute;
        margin-right: 165px;
        margin-top: 30px;
    }
}

.nas-izbor-home {
    position: absolute;
    margin-top: -140px;
    margin-left: 50px;
}

.nas-izbor-home img { 
    min-width: 75px !important;
    height: auto !important;
    max-width: 75px !important; 
}

.nas-izbor-home .content-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}


/* Ensures the image badge doesn't shrink. */
.nas-izbor-home .image-container {
    flex-shrink: 0;
}

/* Sets a fixed height for the image badge. */
.nas-izbor-home .badge-image {
    height: 3rem; /* 48px */
}

/* Styling for the main headline, e.g., "LaptopShop.ba Izbor" */
.nas-izbor-home .choice-text {
    font-weight: 700; /* bold */
    color: rgb(31 41 55); /* text-gray-800 */
    font-size: 1rem; /* 16px */
    line-height: 1.5rem; /* 24px */
    margin-bottom: 0px; /* 4px */
}

/* Styling for the new description text. */
.nas-izbor-home .choice-description {
    font-size: 0.875rem; /* 14px */
    line-height: 1.25rem; /* 20px */
    color: rgb(75 85 99); /* text-gray-600 */
    margin-bottom: 0px; /* 8px */
}

/* Styling for the link, e.g., "Pogledajte zašto" */
.nas-izbor-home .show-more-link {
    display: flex;
    align-items: center;
    gap: 0.25rem; /* 4px */
    color: rgb(37 99 235); /* text-blue-600 */
    font-weight: 600; /* semibold */
    font-size: 0.875rem; /* 14px */
    text-decoration: none;
    transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.nas-izbor-home .show-more-link:hover {
    color: rgb(30 64 175); /* hover:text-blue-800 */
}

/* Styling for the arrow icon within the link. */
.nas-izbor-home .arrow-icon {
    height: 1rem; /* 16px */
    width: 1rem; /* 16px */
}


.position-absolute { position: absolute!important; }
.nas-izbor { border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; padding: 10px 0px 10px 0px; }
.nas-izbor .content-wrapper {
    display: flex;
    align-items: left;
    gap: 10px;
}


/* Ensures the image badge doesn't shrink. */
.nas-izbor .image-container {
    flex-shrink: 0;
}

/* Sets a fixed height for the image badge. */
.nas-izbor .badge-image {
    height: 3rem; /* 48px */
}

/* Styling for the main headline, e.g., "LaptopShop.ba Izbor" */
.nas-izbor .choice-text {
    font-weight: 700; /* bold */
    color: rgb(31 41 55); /* text-gray-800 */
    font-size: 1rem; /* 16px */
    line-height: 1.5rem; /* 24px */
    margin-bottom: 0px; /* 4px */
}

/* Styling for the new description text. */
.nas-izbor .choice-description {
    font-size: 0.875rem; /* 14px */
    line-height: 1.25rem; /* 20px */
    color: rgb(75 85 99); /* text-gray-600 */
    margin-bottom: 0px; /* 8px */
}

/* Styling for the link, e.g., "Pogledajte zašto" */
.nas-izbor .show-more-link {
    display: flex;
    align-items: center;
    gap: 0.25rem; /* 4px */
    color: rgb(37 99 235); /* text-blue-600 */
    font-weight: 600; /* semibold */
    font-size: 0.875rem; /* 14px */
    text-decoration: none;
    transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.nas-izbor .show-more-link:hover {
    color: rgb(30 64 175); /* hover:text-blue-800 */
}

/* Styling for the arrow icon within the link. */
.nas-izbor .arrow-icon {
    height: 1rem; /* 16px */
    width: 1rem; /* 16px */
}
    
@media (max-width: 767px) {
    .nas-izbor-category {
        position: absolute;
        margin-left: 0px;
        margin-top: 120px;
        width: 100px;
    }
  .hide-mobile {
    display: none;
  }
}

.image-mobile, .hide-desktop {
  display: none;
}

@media (max-width: 767px) {
    
    .slick-slide img, .slick-initialized .slick-slide {
        display: block;
        margin-bottom: 50px;
    }

  .image-mobile {
    display: block !important;
    margin-bottom: 10px;
    /*margin-top: 0px;*/
    margin-top: 30px;
    position: relative; /* Ensure .image-mobile is positioned */
    overflow: visible; /* Add this line */
    /* height: auto;  Remove or comment out this line */
  }
  .image-mobile img {
    z-index: 0;
    position: relative;
    max-width: 100%; /* Ensure image doesn't overflow its container */
    height: auto;       /* Maintain image aspect ratio */
  }
  .hide-desktop { display: block !important; }
  .gamedetailBox h1, .review h3.review-title {
    position: relative;
    z-index: 1;
    font-size: 20px;
  }
}


/* Container Page Head (Klantenservice title) */
.container-page-head {
    display: flex;
    flex-direction: column; /* Stack title and subtitle vertically */
    max-width: 1280px;
    margin: 20px auto;
    background-color: #fff; /* Background for the header container */
    border-radius: 5px;
    overflow: hidden;
    padding: 0px; /* Adjusted padding here */
    box-sizing: border-box; /* Include padding in element's total width and height */
}

.container-page-head h1 {
    margin: 0;
    font-size: 26px;
    font-weight: 900;
    color: #285dab;
    text-transform: uppercase;
    line-height: 1;
}

.container-page-head h4 {
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    margin-top: 3px;
}

/* Main Page Container (Sidebar + Content) */
.container-page {
    display: flex;
    max-width: 1280px;
    margin: 20px auto;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #f2f7fc;
    overflow: hidden;
    /*box-shadow: 0 2px 4px rgba(0,0,0,0.05);*/
}

/* Sidebar */
.sidebar-page {
    width: 250px; /* Fixed width for desktop */
    padding: 20px 0; /* Adjusted padding to remove left/right padding and handle it with li a padding */
    border-right: 1px solid #f2f7fc;
    box-sizing: border-box;
    min-width: 250px; /* Fixed width for desktop */
}

.sidebar-page ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar-page li {
    padding: 0; /* Reset padding on li, handled by a */
    border-left: 3px solid transparent; /* Use transparent for default state */
    transition: border-left 0.2s ease-in-out; /* Smooth transition for hover effect */
}

.sidebar-page li:hover {
    border-left: 3px solid #0090e2; /* Blue border on hover */
}

.sidebar-page li a {
    display: block;
    padding: 10px 15px; /* Padding for link text */
    text-decoration: none;
    color: #111;
    border-bottom: 1px solid #f2f7fc;
    background: #fff;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; /* Smooth transitions */
}

.sidebar-page li a:hover {
    background: #f2f7fc;
    color: #007bff; /* Blue text on hover */
}

.sidebar-page li.active {
    border-left: 3px solid #0090e2;
}

.sidebar-page li:last-child a {
    border-bottom: none; /* No border for the last item */
}

/* Main Content Area */
.content {
    flex-grow: 1;
    padding: 20px;
    box-sizing: border-box;
}

.content h2 {
    font-size: 16px;
    color: #111;
    margin-top: 0;
    margin-bottom: 10px;
}

/* Card Grids (Snel zelf regelen) */
.card-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    margin-bottom: 30px;
}

.card {
    /*border: 1px solid #ddd;*/
    border-radius: 5px;
    padding: 0; /* Remove internal padding to allow image full width */
    text-align: left;
    background-color: #fff; /* White background for cards */
    overflow: hidden; /* Ensure image doesn't overflow rounded corners */
}

.card img {
    width: 100%; /* Make image full width of its container */
    height: 180px; /* Set a fixed height for consistency */
    object-fit: cover; /* Cover the area, cropping if necessary */
    border-radius: 5px 5px 0 0; /* Apply top border-radius to the image itself */
    margin-bottom: 0;
}

.card h3 {
    font-size: 16px;
    margin: 15px 15px 5px 15px; /* Padding for text inside the card */
    color: #111;
    font-weight: 900;
}

.card ul {
    list-style: none;
    padding: 0 15px 15px 15px; /* Padding for the list items */
    margin: 0;
}

.card ul li {
    margin-bottom: 0px;
}

.card ul li a {
    text-decoration: none;
    color: #007bff; /* Blue for links */
    font-size: 14px;
}

.card ul li a:hover {
    text-decoration: underline;
}


/* Contact Us Section */
.cms-text {
    flex-grow: 1;
    padding: 0px;
    box-sizing: border-box;
}

.page-content-cms h1 { font-size: 18px; color:#111; }
.page-content-cms p { color:#111; font-size: 14px; line-height: 21px;  }


/* Contact Us Section */
.contact-us {
    background-color: #f2f7fc; /* Light blue background */
    border: 1px solid #ddd; /* Match the cards border */
    border-radius: 5px;
    padding: 30px;
    display: flex;
    flex-wrap: wrap; /* Allow items to wrap to the next line */
    justify-content: space-between; /* Push items to ends of line */
    align-items: flex-start; /* Align items to the start (top) */
    text-align: left; /* Default text alignment for the section */
    margin-bottom: 30px;
    box-sizing: border-box;
}

.no-bg { background:#fff!important; }

.contact-us h2 { /* Targeting h2 as per your HTML */
    margin: 0;
    font-size: 16px;
    color: #111;
    font-weight: bold; /* Make the title bold */
    flex-basis: 100%; /* Make the heading take full width */
    margin-bottom: 5px; /* Space below the heading */
}

.contact-us p {
    margin: 0;
    font-size: 14px;
    color: #555;
    flex-basis: 100%; /* Make the paragraph take full width */
    margin-bottom: 0px; /* Space below the description */
}


.contact-us ul {
    list-style: none;
    padding: 0;
    margin-bottom: 00px;
}

.contact-us li {
    margin-bottom: 0px;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #555;
}

.contact-us .checkbox-support {
    margin-right: 6px;
}

.contact-us input[type="checkbox"] {
    margin-right: 10px;
    min-width: 16px;
    min-height: 16px;
    cursor: default; /* Indicate that it's disabled/not interactable */
}

.contact-us .login-button {
    background-color: #00b200; /* Green button */
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    display: block; /* Make button take full width if desired, or inline-block */
    width: fit-content; /* Adjust to content width */
    margin-top: 15px;
    transition: background-color 0.2s ease-in-out;
    text-decoration: none;
    transition: all ease-in-out 300ms;
}

.contact-us .login-button:hover {
    background-color: #00cf00; /* Green button */
    transition: all ease-in-out 300ms;
}

.contact-us .btn-block-support { /* Styling for the <a> tag acting as a button */
    background-color: #007bff;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    text-decoration: none; /* Remove underline from the link */
    display: inline-block; /* Essential for positioning and styling */
    margin-left: auto; /* Pushes the button to the right */
    white-space: nowrap; /* Prevent button text from wrapping */
    transition: background-color 0.2s ease-in-out;
    margin-top: -48px;
}

.contact-us .btn-block-support:hover {
    background-color: #0056b3;
}

/* Mini Card Grid (Als je zelf even wilt kijken) */
.mini-card-grid {
    display: grid;
    gap: 15px;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    margin-bottom: 30px;
}

.mini-card {
    display: flex;
    flex-direction: row; /* Arrange image and text side-by-side */
    align-items: center; /* Vertically align items in the middle */
    padding: 15px; /* Keep padding for the text content */
    border: 1px solid #eee;
    border-radius: 5px;
    background-color: #fff;
    box-sizing: border-box;
    transition: background-color 0.2s ease-in-out;
    position: relative;
    padding-left: 70px;
}

.mini-card:hover {
    background-color: #fff;
    border: 1px solid #ddd;
    transition: background-color 0.2s ease-in-out;
}

.mini-card img {
    position: absolute; /* Take image out of normal flow */
    left: 15px; /* Position it at the left edge of the mini-card's padding */
    top: 50%; /* Center vertically */
    transform: translateY(-50%); /* Adjust for vertical centering */
    width: 40px; /* Keep smaller image size */
    height: 40px; /* Ensure square aspect ratio */
    object-fit: contain; /* Contain the image within its bounds */
    margin-right: 0; /* Remove margin-right since it's absolutely positioned */
    margin-bottom: 0;
}

.image-card {     
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 0;
    text-align: left;
    background-color: #fff;
    overflow: hidden;
}

.mini-card a, .mini-card a:hover {     
    color: #111; text-decoration: none;
}

.image-card img {     
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: 0px 0px 0 0;
    margin-bottom: 0;
    margin-left: -15px;
}

.mini-card p {
    margin: 0; /* Remove default paragraph margins */
    font-size: 14px;
    color: #111;
}


/* Login Section */
.login-section {
    background-color: #f9f9f9;
    border: 1px solid #f2f7fc;
    border-radius: 5px;
    padding: 20px;
    box-sizing: border-box;
}

.login-section h2 {
    font-size: 16px;
    color: #111;
    margin-top: 0;
    margin-bottom: 20px;
}

.login-section ul {
    list-style: none;
    padding: 0;
    margin-bottom: 20px;
}

.login-section li {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #555;
}

.login-section input[type="checkbox"] {
    margin-right: 10px;
    min-width: 16px;
    min-height: 16px;
    cursor: default; /* Indicate that it's disabled/not interactable */
}

.login-button {
    background-color: #28a745; /* Green button */
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    display: block; /* Make button take full width if desired, or inline-block */
    width: fit-content; /* Adjust to content width */
    margin-top: 15px;
    transition: background-color 0.2s ease-in-out;
}

.login-button:hover {
    background-color: #218838;
}

/* Mobile Responsiveness (Media Queries) */
@media (max-width: 768px) {
    
    .container-page-head { margin-top: 60px; }
    .no-padding-top { margin-top: 0px!important; }
    
    .container-page, .container-page-head, .breadcrumbs {
        margin-left: 10px;
        margin-right: 10px;
    }

    .container-page {
        flex-direction: column; /* Stack sidebar and content */
        margin-top: 60px;
    }

    .sidebar-page {
        width: 100%; /* Full width on mobile */
        border-right: none;
        border-bottom: 1px solid #eee;
        padding: 10px 0; /* Adjust padding for mobile sidebar */
    }

    /* You would likely need JavaScript to toggle a mobile menu for the sidebar */
    /* Example:
    .sidebar-page nav {
        display: none; // Hidden by default on mobile
    }
    .sidebar-page.active nav {
        display: block; // Shown when active
    }
    */

    .card-grid,
    .mini-card-grid {
        grid-template-columns: 1fr; /* Single column on mobile */
    }

    .contact-us {
        flex-direction: column; /* Stack items vertically on mobile */
        align-items: center; /* Center items on mobile */
        text-align: center; /* Center text on mobile */
        padding: 15px; /* Slightly reduced padding for mobile */
    }

    .contact-us h2,
    .contact-us p {
        text-align: center; /* Ensure text is centered on mobile */
    }

    .contact-us .btn-block-support {
        width: 100%; /* Make the button full width on mobile */
        margin-left: 0; /* Remove auto margin on mobile */
        margin-top: 15px; /* Add some space above the button on mobile */
        /*box-sizing: border-box;*/
    }

    .login-section {
        padding: 15px; /* Adjust padding for mobile */
    }
}

/* Smallest mobile screens */
@media (max-width: 480px) {
    .container-page-head h1 {
        font-size: 22px;
    }
    .container-page-head h4 {
        font-size: 14px;
    }
    .card h3 {
        font-size: 14px;
    }
    .card ul li a {
        font-size: 14px;
    }
    .contact-us h2 {
        font-size: 16px;
    }
    .contact-us p {
        font-size: 14px;
    }
    .mini-card p {
        font-size: 14px;
    }
    .login-section h2 {
        font-size: 16px;
    }
    .login-section li {
        font-size: 14px;
    }
}


/* --- New Checkout Stepper --- */
.checkout-stepper {
    padding: 25px 0;
    margin-top: 20px;
    /*margin-bottom: 30px;*/
    background-color: transparent; /* Or your desired background for the whole bar */
    /* border-top: 1px solid #e9e9e9; */ /* Optional full-width borders for the section */
    /* border-bottom: 1px solid #e9e9e9; */
}

.checkout-stepper .container {
    /* Standard container behavior - this already centers your content */
}

.checkout-stepper .stepper-track {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
    /* width: 100%; /* CHANGED: Make track use full width of .container */
    max-width: 100%; /* CHANGED: Ensure it can go full width of .container */
    margin: 0 auto; /* Should still center if .container has no padding and track < container */
                    /* If .container has padding, margin: 0; is fine for full width within padding */
}

/* Base line for the track */
.checkout-stepper .stepper-track::before {
    content: "";
    position: absolute;
    top: 17px; /* Vertically center with the 36px marker */
    /* CHANGED: Make line span closer to edges of the track, aligning with marker centers */
    left: 18px;  /* Approx half of marker width (36px / 2) */
    right: 18px; /* Approx half of marker width */
    height: 3px;
    background-color: #e0e0e0;
    z-index: 1;
    border-radius: 3px;
}

/* Progress line (colored part) */
.checkout-stepper .stepper-track::after {
    content: "";
    position: absolute;
    top: 17px;
    /* CHANGED: Align with ::before pseudo-element */
    left: 18px;
    height: 3px;
    background-color: #2ecc71; /* Green for progress */
    z-index: 2; /* Above the base line */
    width: 0%; /* Initial width, will be controlled by progress classes */
    border-radius: 3px;
    transition: width 0.5s ease-in-out;
}

/* PHP should add 'progress-step-2' or 'progress-step-done' to .stepper-track */
/* These widths are relative to the new full-width line (from 18px left to 18px right) */
.checkout-stepper .stepper-track.progress-step-2::after {
    /* Progress to the center of the 2nd node. Since there are 3 nodes,
       the space between node 1 center and node 2 center is 50% of the
       total span between node 1 center and node 3 center. */
    width: 50%;
}
.checkout-stepper .stepper-track.progress-step-done::after { /* Used when step 3 is reached/completed */
    /* Full progress across the span between node 1 center and node 3 center */
    width: 100%;
}


.checkout-stepper .step-item {
    flex: 1;
    max-width: 33.33%; /* This helps distribute them even if text length varies slightly */
    text-align: center;
    position: relative;
    padding: 0 5px; /* Minimal padding */
    box-sizing: border-box;
}

.checkout-stepper .step-marker {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #ffffff;
    border: 3px solid #e0e0e0;
    color: #adb5bd;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 10px auto;
    font-weight: 500;
    font-size: 1rem;
    position: relative;
    z-index: 3; /* Above lines */
    transition: all 0.3s ease-in-out;
}

.checkout-stepper .step-label {
    font-size: 14px;
    color: #6c757d;
    font-weight: 500;
    line-height: 1.4;
    margin: 0;
    transition: color 0.3s ease-in-out, font-weight 0.3s ease-in-out;
}

/* Completed Step Styles */
.checkout-stepper .step-item.is-completed .step-marker {
    background-color: #2ecc71;
    border-color: #2ecc71;
    color: #ffffff;
}
.checkout-stepper .step-item.is-completed .step-label {
    color: #28a745;
    font-weight: 500;
}

/* Active Step Styles */
.checkout-stepper .step-item.is-active .step-marker {
    border-color: #2ecc71;
    color: #2ecc71;
    background-color: #fff;
    transform: scale(1.1);
    font-weight: 900;
}
.checkout-stepper .step-item.is-active .step-label {
    color: #2ecc71;
    font-weight: 700;
}

/* Specific style for when step 3 is active AND completed (final step) */
.checkout-stepper .step-item.is-active.is-completed .step-marker {
    background-color: #2ecc71;
    border-color: #2ecc71;
    color: #ffffff;
}
.checkout-stepper .step-item.is-active.is-completed .step-label {
    color: #28a745;
    font-weight: 700;
}


/* --- Mobile Adjustments --- */
@media (max-width: 767px) {
    .checkout-stepper {
        padding: 0px 0;
        margin-top: 60px;
        margin-bottom: 20px;
    }
    .checkout-stepper .stepper-track {
        /* max-width: 100%; /* Already set */
        padding: 0 5px; /* Give a little space from container edges if container has no padding */
        box-sizing: border-box;
    }
    .checkout-stepper .stepper-track::before,
    .checkout-stepper .stepper-track::after {
        /* Adjust line offsets for mobile if markers are smaller or closer to edge */
        left: 15px;  /* Half of 30px mobile marker */
        right: 15px;
    }
    /* Progress line widths need to match the new span (full width between marker centers) */
    .checkout-stepper .stepper-track.progress-step-2::after { width: 50%; }
    .checkout-stepper .stepper-track.progress-step-done::after { width: 100%; }


    .checkout-stepper .step-item {
        padding: 0 3px;
    }
    .checkout-stepper .step-marker {
        width: 30px;
        height: 30px;
        border-width: 2px;
        font-size: 0.85rem;
        margin-bottom: 6px;
    }
    .checkout-stepper .stepper-track::before,
    .checkout-stepper .stepper-track::after {
        top: 14px; /* Align with smaller 30px marker */
        height: 2px;
    }
    .checkout-stepper .step-label {
        font-size: 10px;
        line-height: 1.2;
        font-weight: 900;
    }
     .checkout-stepper .step-item.is-active .step-label {
        font-weight: 700;
    }
}

@media (max-width: 400px) {
    .checkout-stepper .step-label {
        font-size: 9px;
    }
    .checkout-stepper .step-marker {
        width: 28px;
        height: 28px;
    }
    .checkout-stepper .stepper-track::before,
    .checkout-stepper .stepper-track::after {
        top: 13px; /* Align with 28px marker */
    }
}

/* Base styles from your global.css are assumed, these are enhancements */
body {
    font-family: 'DM Sans', sans-serif;
    margin: 0;
    background-color: #fff; /* Very light, almost white background for a fresh feel */
    color: #222;
    line-height: 1.6;
}

.container-brendovi {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 20px; /* Increased padding */
}

.section {
    background: #ffffff;
    padding: 30px; /* More generous padding inside sections */
    border-radius: 5px; /* More pronounced rounded corners */
    box-shadow: 0 4px 20px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.02); /* Deeper, softer shadow */
    margin-bottom: 20px; /* More space between sections */
    text-align: center; /* Center content within sections by default */
}

.section-title {
    font-size: 22px;
    font-weight: 700;
    margin: 0px;
    padding: 0px;
    color: #285dab;
    text-decoration: none;
}

.section-desc {
    display: block;
    line-height: 12px;
    clear: both;
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    margin-top: 3px;
    padding: 0px;    
}
        
.section .btn-primary-brendovi {
    display: inline-block;
    background: #0090e2;
    color: white;
    padding: 14px 28px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
    font-size: 13px;
    transition: background-color 0.2s ease, transform 0.1s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-top:30px;
}

.grid {
    display: grid; /* Use CSS Grid for better control */
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    gap: 5px; /* Increased gap */
    justify-items: center; /* Center grid items */
    margin-top: 30px; /* Space above the grid */
}

.brand-card, .tech-card {
    background: #ffffff;
    border: 1px solid #e9eff4; /* Very subtle light border */
    border-radius: 5px; /* Consistent rounded corners */
    text-align: center;
    text-decoration: none;
    color: #222;
    padding: 20px 20px; /* More padding inside cards */
    transition: all 0.25s ease-out; /* Smoother transition */
    display: flex; /* Flexbox for internal alignment */
    flex-direction: column;
    align-items: center;
    justify-content: space-between; /* Space out content vertically */
    width: 90%; /* Ensure it fills grid cell */
    box-shadow: 0 2px 10px rgba(0,0,0,0.03); /* Subtle initial shadow */
    overflow: hidden; /* For image border-radius */
}

.brand-card:hover, .tech-card:hover {
    border-color: #00a3e0; /* Vibrant blue hover border */
    box-shadow: 0 8px 25px rgba(0,0,0,0.12); /* More pronounced shadow on hover */
    transform: translateY(-2px); /* More noticeable lift */
    text-decoration: none;
}

.brand-logo-wrapper {
    height: 80px; /* Fixed height for consistent logo display */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    width: 100%; /* Ensure wrapper takes full width for centering */
}

.brand-logo-wrapper img {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
    transition: opacity 0.2s ease;
}
        
.brand-logo-wrapper img:hover {
    max-width: 90%;
    max-height: 90%;
}

/* Specific styles for brand logo hover effect (dark to color) */
.brand-logo-wrapper .brand-logo-default {
    display: block;
}
.brand-logo-wrapper .brand-logo-hover {
    display: none;
}
.brand-card:hover .brand-logo-wrapper .brand-logo-default {
    display: none;
}
.brand-card:hover .brand-logo-wrapper .brand-logo-hover {
    display: block;
}

.brand-card p {
    font-weight: 700;
    font-size: 18px; /* Converted from 1.1rem (1.1 * 16px = 17.6px rounded to 18px) */
    color: #333;
    margin-top: 10px; /* Space between logo and text */
}

/* Technology cards specific styles */
.tech-card {
    padding: 0; /* Remove padding from card itself, content div will have it */
    max-width: 320px; /* Max width for tech cards */
}

.tech-card img {
    width: 100%;
    height: auto; /* Ensure image scales proportionally */
    object-fit: cover;
    display: block;
    background: #f2f7fc;    
}

.tech-content {
    padding: 25px; /* Padding for text content */
    text-align: left; /* Align text left within content */
    flex-grow: 1; /* Allow content to fill space */
}

.tech-content h3:hover, .tech-content p:hover  {
    text-decoration: none;
}

.tech-content h3 {
    font-size: 18px;
    color: #0090e2;
    margin: 0 0 8px;
    font-weight: 700;
}

.tech-content p {
    font-size: 14px;
    color: #444;
    line-height: 21px;
    margin-bottom: 0;
}

/* Highlight sections (two-column layout) */
.highlight-section {
    background: #fff; /* Lighter blue background for highlight sections */
    padding: 0px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    display: flex;
    align-items: center;
    border-radius: 5px;
    gap: 40px; /* More space between columns */
    flex-wrap: wrap; /* Allow wrapping on smaller screens */
    margin-bottom: 50px;
    text-align: left; /* Align text left within highlight section */
}

.highlight-section:nth-of-type(even) { /* Alternate image/text order */
    flex-direction: row-reverse;
}

.highlight-text {
    flex: 1 1 45%; /* Flexible width for text, around 45% */
    min-width: 300px; /* Minimum width before wrapping */
    padding-left: 30px;
    padding-right: 30px;
}

.highlight-text h3 {
    font-size: 21px; /* Prominent heading */
    color: #005a9e; /* Darker blue for headings */
    margin-bottom: 5px;
    line-height: 1.2;
    font-weight: 700;
}

        
.highlight-text .desc { 
    display: block;
    line-height: 12px;
    clear: both;
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #0090e2;
    font-family: "Roboto Slab", serif;
    margin-top: 3px;
    margin-bottom: 10px;
    padding: 0px;
}
        
.highlight-text p {
    line-height: 22px;
    margin: 0px;
    font-size: 14px;
    color: #111;
    margin-bottom:10px;
}

.highlight-text .btn-primary-brendovi {
    display: inline-block;
    background: #0090e2;
    color: white;
    padding: 14px 28px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    font-size: 13px;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.highlight-text .btn-primary-brendovi:hover {
    background: #005a9e; /* Darker blue on hover */
}

.app-download-links {
    display: flex;
    gap: 15px;
    margin-top: 25px; /* More space above app links */
    justify-content: flex-start; /* Align left */
    flex-wrap: wrap;
}

.app-download-links img {
    height: 45px; /* Slightly larger app icons */
    width: auto;
}

.highlight-image {
    flex: 1 1 45%; /* Flexible width for image, around 45% */
    min-width: 300px;
    overflow: hidden;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
}

.highlight-image img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}
        
.css-h350ag {
    color: #f60 !important;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .container-brendovi {
        padding: 25px 15px;
        margin-top: 40px;
    }
    .section {
        padding: 20px; /* Reduced padding for smaller screens */
        margin-bottom: 25px; /* Slightly more space between sections */
        border-radius: 5px;
    }
    .section-title {
        font-size: 20px; /* Adjusted title size */
        margin-bottom: 10px; /* Reduced margin */
    }
    .section-desc {
        font-size: 15px; /* Adjusted description size */
        margin-bottom: 20px; /* Reduced margin */
        line-height: 1.4; /* Improved line height for readability */
    }
    .grid {
        /* This grid should allow multiple items per row for brands, but not necessarily for tech cards */
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); 
        gap: 10px; /* Reduced gap for more compact layout */
    }
    .brand-card {
        padding: 15px; /* Reduced card padding */
        border-radius: 8px;
        width: 100%; /* Ensure cards take full width of their grid cell */
    }
    /* Specific adjustment for tech-card to be 100% width on mobile */
    .tech-card {
        max-width: 100%; /* Override desktop max-width */
        width: 100%; /* Ensure it takes full width of its grid cell */
        /* If you want only one tech card per row on smaller mobiles, adjust grid-template-columns for the section containing tech cards */
    }
    /* To make tech cards truly 100% width and stack, the grid for the tech section needs to change */
    .section:nth-of-type(2) .grid { /* Targeting the "Tehnologije ekrana" grid */
        grid-template-columns: 1fr; /* Force single column for tech cards on mobile */
        gap: 20px; /* More space between stacked tech cards */
    }

    .brand-logo-wrapper {
        height: 50px; /* Reduced logo wrapper height */
        margin-bottom: 10px; /* Reduced margin */
    }
    .brand-card p {
        font-size: 15px; /* Adjusted brand name font size */
    }
    .tech-card img {
        height: 120px; /* Adjusted image height for tech cards */
        object-fit: cover; /* Ensure images fill the space correctly */
    }
    .tech-content {
        padding: 15px;
    }
    .tech-content h3 {
        font-size: 16px;
        text-align: center;
    }
    .tech-content p {
        font-size: 13px;
        line-height: 1.5; /* Adjusted line height */
    }
    .highlight-section {
        flex-direction: column; /* Stack columns on mobile */
        padding: 20px; /* Adjusted padding for highlight section */
        gap: 20px; /* Adjusted gap */
        margin-bottom: 30px; /* Reduced bottom margin */
    }
    .highlight-section:nth-of-type(even) { /* Reset order for mobile stacking */
        flex-direction: column;
    }
    .highlight-text, .highlight-image {
        flex: 1 1 100%; /* Full width for text and image */
        min-width: unset;
        padding: 0; /* Remove horizontal padding from text/image on mobile, section padding handles it */
    }
    .highlight-text h3 {
        font-size: 22px; /* Adjusted heading size */
        margin-bottom: 0px;
    }
    .highlight-text .desc { line-height: 18px; }
    .highlight-text p {
        font-size: 14px;
        line-height: 1.5; /* Adjusted line height */
    }
    .highlight-text .btn-primary-brendovi {
        padding: 10px 18px;
        font-size: 13px;
        margin-top: 20px; /* Adjusted button margin */
    }
    .app-download-links {
        justify-content: center; /* Center on mobile */
        margin-top: 20px; /* Adjusted margin */
        gap: 10px; /* Reduced gap between app links */
    }
    .app-download-links img {
        height: 35px; /* Adjusted app icon size */
    }
    .highlight-image { border-radius: 5px!important; }
}

@media (max-width: 480px) {
    .section {
        padding: 15px;
    }
    .section-title {
        font-size: 21px; /* Further reduced title size */
        margin-bottom: 8px;
    }
    .section-desc {
        font-size: 13px; /* Further reduced description size */
        margin-bottom: 15px;
    }
    .grid {
        grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); /* Even smaller minmax for more items per row */
        gap: 8px; /* Even smaller gap */
    }
    /* Ensure tech-cards remain single column on very small screens */
    .section:nth-of-type(2) .grid { /* Targeting the "Tehnologije ekrana" grid */
        grid-template-columns: 1fr; /* Keep single column for tech cards on very small mobile */
        gap: 15px; /* Adjusted gap */
    }
    .brand-card, .tech-card {
        padding: 10px; /* Further reduced card padding */
    }
    .brand-logo-wrapper {
        height: 40px; /* Further reduced logo height */
        margin-bottom: 8px;
    }
    .brand-card p {
        font-size: 13px; /* Further reduced brand name font size */
    }
    .tech-card img {
        height: 200px; /* Further reduced tech card image height */
    }
    .tech-content {
        padding: 10px;
    }
    .tech-content h3 {
        font-size: 14px;
    }
    .tech-content p {
        font-size: 13px;
    }
    .highlight-section {
        padding: 15px;
        gap: 15px;
    }
    .highlight-text h3 {
        font-size: 21px;
        padding-left: 10px;
        padding-top: 10px;
        
    }
    .highlight-text p {
        font-size: 13px;
        padding-left: 10px!important;
        padding-top: 0px;
    }
    .highlight-text .btn-primary-brendovi {
        padding: 8px 15px;
        font-size: 13px;
        margin-top: 5px;
        margin-left: 10px;
    }
    .app-download-links img {
        height: 30px;
    }
    .highlight-image { border-radius: 5px!important; }
}
        
@media (min-width: 1280px) {
    .container-brendovi {
        max-width: 1280px!important
    }
}
        

.review-text span { font-size: 14px; display: inline-block !important; text-decoration: underline; }
.rating { padding: 0; margin: 0; line-height: 0; }
.rating li { vertical-align: middle; width: 24px; overflow: hidden; height: 24px; text-indent: -999px; display: inline-block; background-size: 24px; background-image: url(/game_computer_store/img/svg/empty.svg);  background-position: left center; background-repeat: no-repeat; }
.rating li:not(:last-child) { margin: 0 1px 0 0; }
.rating li.is-active { background-image: url(/game_computer_store/img/svg/star.png); margin-top: -2px; }
.rating li.is-half-active { background-image: url(/game_computer_store/img/svg/star-half.png); }
.green-rating .rating li { width: 1.4375rem; height: 1.5rem; background-size: 1.4375rem; }
.green-rating .rating li.is-active { background-image: url(/game_computer_store/img/svg/star.png); }
.green-rating .rating li.is-half-active { background-image: url(/game_computer_store/img/svg/star-half.png); }
.benefit { border-radius: 5px; }
.benefit,.operator__right { overflow:hidden;border:1px solid #ddd;padding-top:1.375rem;padding-right:1.25rem;padding-left:1.25rem; }
.benefit h3,.operator__right h3 { margin-bottom:.4375rem;font-size:1.375rem; }
.benefit ul,.operator__right ul { margin:0 -1.25rem; }
.benefit ul li,.operator__right ul li { line-height:16px;border-top:1px solid #ddd;position:relative;font-size:14px;color:#111;padding:.8125rem 1.25rem .8125rem 3.9375rem; }
.benefit ul li:first-child,.operator__right ul li:first-child { border:0 none; }
.benefit ul li strong,.operator__right ul li strong { display:block;color:#111; }
.benefit ul li img,.operator__right ul li img { max-width:2rem;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;top:50%;left:18px; }
.benefit ul li { padding:.8125rem 1.25rem .8125rem 3.9375rem !important; }
.benefit--filter,.benefit--widget { margin-bottom:1.25rem;padding-top:1.375rem;padding-right:1.125rem;padding-left:1.125rem; }
.benefit--widget h3 { margin-bottom:18px;font-size:18px;font-weight:700; }
.benefit--filter h3 { margin-bottom:5px;font-size:18px;font-weight:700; color:#111; }
.benefit--filter ul li,.benefit--widget ul li { transition:.3s ease-in-out;padding:.375rem 1.25rem .375rem 3.9375rem; color:#111; }
.benefit--filter ul li:hover,.benefit--widget ul li:hover { background:#fff; }
.benefit--filter,.benefit--filter ul li { border-color:#ddd; }
.benefit--filter a.monri img { padding-bottom: 15px; padding-top: 5px; }
.listing { border:1px solid #ddd; margin-bottom: 50px; padding: 20px 20px 9px 20px; border-radius: 5px; }
.listing h4 { font-weight:700; margin-bottom:6px; color: #111; }
.listing ul { margin:0; }
.listing ul li { margin-bottom:0; line-height: 24px; }
.listing ul li a { display:inline-block;position:relative;padding-left:.9375rem;color:#111; }
.listing ul li a:hover { color:#111; }
.listing ul li a:before { content:'';display:block;width:.375rem;height:.375rem;border-radius:50%;transition:.3s ease-in-out;background:#f1f1f1;position:absolute;top:8px;left:0; }
.listing ul li a:hover:before { background:#f60; }
.tabBox { margin-bottom: 0px; }
.tabBox ul.tabs{list-style:none;overflow:hidden; }
.tabBox ul.tabs li { float:left;position:relative; }
.tabBox ul.tabs li+li { margin-left: -1px; }
.tabBox ul.tabs li a { display: block; overflow: hidden; color: #111; background: #fff; border: 2px solid #fff; position: relative; font-size: 14px; font-weight: 500; padding: 9px 25px; text-decoration: none; }
.tabBox ul.tabs li a:hover, .tabBox .nav-tabs>li.active>a,.tabBox .nav-tabs>li.active>a:hover { color:#111;background:#f2f7fc;border-bottom-color:#0090e2; }
.tabBox ul.tabs li.r-tabs-state-active a,.tabBox .nav-tabs>li.active>a:focus { color:#0090e2; background:#fff; border-bottom-color:#0090e2; }
.tabBox .nav-tabs>li.active>a:hover { color:#111; background:#f2f7fc; border-bottom-color:#0090e2; }
.tabBox ul.tabs li:first-child a {  }
.tabBox ul.tabs li:last-child a {  }
.tabBox ul.tabs img,.specificatiesBox h5 img,.specificatiesBox img { display:none!important; }
.r-tabs .r-tabs-panel { padding:0px; }
.offerBox { width:100%;margin-bottom:1.875rem; }
.offerbox-product { width:100%;border:1px solid #ddd; border-radius: 5px; background:#fff;position:relative;padding:20px; max-height: 290px; }
.offerbox-product .ups-block { border:none;position:relative;padding:1rem 0 0; }
.offerbox-product .ups-block strong { font-size:16px;font-weight:700; color:#285dab; }
.offerbox-product .ups-block li { line-height:24px; color:#111; }
.offerbox-product p { margin-bottom: 0px; }
.offerBox .offerbox-product .discount{ position:absolute;top:0;right:0;width:137px;text-align:center;height:36px;line-height:36px;font-size: 14px;color:#fff;text-decoration:none;background:#f60;border-radius:2px; }
.offerBox .offerbox-product .col-sm-4 .discount { display:none; }
.offerBox .reviews { margin-bottom: 10px; }
.offerBox h2 { margin-bototm: 10px; }
@media (max-width: 767px) {
    .offerBox { margin-top: 240px; } 
    .offerBox .offerbox-product .col-sm-8 .discount  { display: none }
    .offerBox .offerbox-product .col-sm-4 .discount  { display: initial }
    .offerbox-product img { margin-top: 0px; }
    .offerbox-product-img { margin-bottom: 30px; }
    .offerbox-product { max-height: 290px; }
}
.average-rating h4  { display: inline-block; margin: 0 0.625rem 0 0}
.average-rating .green-rating { display: inline-block;  margin: 0 0 0.625rem 0}
.table-specifications.table>tbody>tr td { border: 0;font-size: 14px; color: #111; }
.table-specifications.table>tbody>tr:nth-child(even) td { background: #f2f7fc;font-size: 14px; color: #111;}
.review { border-bottom: 1px solid #ddd; padding-top: 10px; padding-bottom: 10px; }
.review .review-top { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -0.9375rem; margin-bottom: 1rem; margin-left: -0.9375rem; }
.review .review-top>li { padding-right: 0.9375rem; padding-left: 0.9375rem; }
.review .review-top>li+li { position: relative; color:#111; }
.review .review-top>li+li:before { width: 1px; content: ''; height: 0.9375rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); background: #8c8c8c; position: absolute; top: 50%; left: 0; }
.assembledParts { width: 100%; border: 1px solid #ddd; padding: 20px; margin-bottom:50px; border-radius: 5px; }
.assembledParts p, .assembledParts a { font-size: 14px; color: #c4c4c4; line-height: 28px; padding: 0; margin-top: 0px; }
.assembledParts a:hover { color: #f60; }
.assembledParts h3 { margin: 0px; padding: 0px; font-size: 18px; color: #fff; font-weight: 800; line-height: 24px; margin-bottom: 10px; }
.assembledParts .listrow { margin: 0 -18px 20px 0; }
.assembledParts .assemblyPart i.fa { float: right; margin-top: 6px; margin-right: 6px; display: none; }
.assembledParts .assemblyPart.active { display: block; }
.assembledParts .assemblyPart { font-size: 14px; color: #c4c4c4; line-height: 28px; display: none; padding: 0px 0px 0px 19px; line-height: 26px; border: 1px solid #ddd; width: calc(50% - 10px); float: left; margin-right: 10px; margin-top: -1px; }
@media (max-width: 479px) {
    .mobile-time { border-radius: 5px; padding: 10px; margin:10px; padding-left: 50px; padding-top: 0px; padding-bottom: 10px;  border: 1px solid #ddd; }
    .mobile-time  .heading__time:before { left: -40px;}
    .mobile-delivery { margin: 10px; padding: 0px;}
    .assembledParts .listrow { margin: 0px; }
    .assembly-box { margin-top: 10px!important; }
    .redirect_shipping_link { text-decoration: none; }
    .mobile-app .ProductDetailsComponent .shipping-holder { margin: 0 0 25px; padding: 15px; display: flex; justify-content: center; }
    .redirect_shipping_link .redirect_shipping { display:flex;grid-gap:12px;position:relative;padding:20px 16px;margin:10px 0;color:#111;text-decoration:none;background:#fff;border-radius:5px;border:1px solid #ddd;font-weight:400;font-size: 14px;line-height:17px}
}
@media (min-width: 480px) {
    .mobile-time { display: none; }
    /*.mobile-time, .mobile-delivery { display: none; }*/
    .delivery-desktop { margin: 10px; padding: 0px;}
    .redirect_shipping_link { text-decoration: none; }
    .mobile-app .ProductDetailsComponent .shipping-holder { margin: 0 0 25px; padding: 15px; display: flex; justify-content: center; }
    .redirect_shipping_link .redirect_shipping{display:flex;grid-gap:12px;position:relative;padding:20px 16px;margin:10px 0;color:#111;text-decoration:none;background:#fff;border-radius:5px;border:1px solid #ddd;font-weight:400;font-size: 14px;line-height:17px}
}
@media (max-width: 767px) {
    .assembledParts .assemblyPart { width: 100%; }
    .assembly-box .sale-box, .assembly-box .price-box, .sold-quantity-box, .ups-box, .review-box { width: 100%!important; clear: both; }
    .review-box { margin-bottom: 15px; }
    .rate-pay { width: 35%; float: right; margin-bottom: 10px; }
    .price-box .price { float: left; width: 50%; margin-top: 12px; }
    .assembly-box { margin-top: 10px;}
    .assembly-box .sale-box { border-right: 1px solid #ddd; }
    .container .heading h1 { font-size: 23px; margin-bottom: 0px; }
    .container .heading p { line-height: 22px; }
    .gamedetailBox .rate-pay { margin-left: 150px; min-width: 205px; margin-top: 0px!important; position: absolute !important; padding: 0px; }
    .gamedetailBox .rate-pay p { 
        font-size: 13px;
        text-transform: uppercase;
        float: right;
        margin-right: 20px;
        min-width: 200px; 
    }
    .gamedetailBox li.ok { margin-top: 6px; }
}

@media (max-width: 767px) {
    .gamedetailBox .rate-pay p { 
        font-size: 13px;
        text-transform: uppercase;
        float: right;
        margin-right: 20px;
        min-width: 140px;
    }
    .shipping-info { font-size: 13px; }
}

@media (max-width: 320px) {
    .gamedetailBox .rate-pay p { 
        min-width: 104px;
        font-size: 11px;
    }
}



.assembly-box { margin-bottom: 0px; margin-top: 30px; border-radius: 5px; }
.assembly-box .description-box, .assembly-box .price-box, .assembly-box .sold-quantity-box, .assembly-box .ups-box, .assembly-box .review-box, .assembly-box .availabillity-box, .assembly-box .price-box { border: 1px solid #ddd; background: #fff; padding: 0.625rem 1.25rem; border-radius: 5px; }
.assembly-box .sold-quantity-box strong { color: #fff; border-bottom: 2px solid #fff; }
.assembly-box .description-box  { border-bottom: 0; padding: 1.4375rem; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; }
.assembly-box .description-box h2 { font-size: 18px;margin-bottom: 5px; }
.assembly-box .price-box { border-bottom: 0;border-right: 0;border-left: 0; }
.assembly-box .price-box .price strong{line-height:1;font-weight:700;display:inline-block;vertical-align:middle;margin-right:.3125rem;margin-bottom:.25rem;font-size:28px; text-transform: uppercase; }
.assembly-box .price-box .price small{vertical-align:middle;font-size:1.25rem; }
.assembly-box .price-box .price span { display:block;font-size: 14px;color:#111; }
.assembly-box .sold-quantity-box { border-bottom:0;border-right:0;border-left:0; }
.assembly-box .ups-box { float:right;width:50%;border-bottom:0; }
.assembly-box .upsBox ul li:before { top:3px; }
.assembly-box .review-box { float:left;width:100%; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
.assembly-box .review-box p { color:#111;margin:0; }
.assembly-box .review-box a { text-decoration:underline; }
.assembly-box .review-box .rating li { width: 24px; height: 24px; background-size: 1.4375rem; }
.assembly-box .review-box .rating { display:inline-block;margin-right:.625rem;margin-bottom:.3125rem!important; }
.assembly-box .availabillity-box { float:right;width:50%; }
.assembly-box .availabillity-box li { position:relative;padding-left:1.5625rem;color:#111; }
.assembly-box .availabillity-box li:before { content: ''; display: block; width: 1rem; height: 1rem; position: absolute; top: 0.25rem; left: 0; background-size: 100%; background-image: url(/game_computer_store/img/list-green.png); background-position: left center; background-repeat: no-repeat; }
.assembly-box .sale-box { width:50%;float:left;border-left:1px solid #ddd;background:#fff; }
.assembly-box .productSliderVertical .gallery img { max-width: 289px!important; }
.assembly-box .slider_dotted { display: none; }
.sold-quantity-box p .assembly-box .description-box p { margin: 0; color: #111; font-size: 14px; line-height: 18px; font-family: "DM Sans", sans-serif; border-radius: 5px; }

.filterBox { width:100%;overflow:hidden;background:#fff; padding: 0px 15px 15px 0px; }
.filterBox .form-control:disabled { color:#fff;background:#111; }
.filterBox .filter-option-amount { color:#9a9a9a; }
.filterBox h3 { font-size: 14px;color:#ee3124;font-weight:700;display:block; }
.filterBox .activeFilters { margin:0 0 20px;padding:4px 0 0; }
.filterBox .activeFilters ul { border:1px solid #ddd;border-bottom:none; border-radius: 5px; }
.filterBox .activeFilters li { border-bottom:1px solid #ddd;padding:7px; }
.filterBox .closebtn { font-size:16px;color:#111;text-decoration:none; }
.filterBox ul,.filterBox ol{list-style:none;overflow:hidden;margin:0;padding:0; }
.filterBox .rangeSlider {    padding: 10px 0px 0 0; width: 100%; overflow: hidden; margin: 0 0 20px 0; }
.filterBox .rangeSlider .ui-slider .ui-slider-handle { margin: 0 0 0 -7px; cursor: pointer; top: -4px; width: 13px; height: 13px; position: absolute; border: 1px solid #7f7f7f; border-radius: 100%; }
.filterBox .rangeSlider .ui-slider{height:4px;background:#dedede;position:relative;margin-bottom:16px; }
.filterBox .rangeSlider .ui-slider-horizontal .ui-slider-range{height:4px;background:#7f7f7f;position:absolute; }
.filterBox .rangeSlider .slider { padding:6px; }
.filterBox .range { padding:0 7px; }
.filterBox .range-values { text-align:center;line-height:45px; }
.filterBox .range-values .input-group { width:46%; }
.filterBox .categoriesBox ul { list-style:none;overflow:hidden; }
.filterBox .categoriesBox li { display:block;padding:0; }
.filterBox .categoriesBox li span { color:#777; }
.filterBox .categoriesBox li a { display:block;position:relative;font-size: 14px;color:#111;text-decoration:none;padding:0 20px 0 0; }
.filterBox .categoriesBox li a:hover { color:#0090e2; text-decoration:underline;  }
.filterBox .title { font-size:16px;font-weight:700;margin:0 0 5px; color:#111; }
.filterBox .panel { border: 0; border-radius: 0; box-shadow: none; background: transparent; border-top: 1px solid #ddd; }
.filterBox .panel-group .panel-heading+.panel-collapse>.panel-body,.filterBox .panel-group .panel-heading+.panel-collapse>.list-group { border:0;padding:5px 0; }
.filterBox .panel-heading { background-color:transparent;border:0;color:#fff;padding:5px 0; }
.filterBox .panel-heading a { color:#fff; }
.filterBox .panel-title .chevron { float:right;font-size:10px;font-weight:400;color:#999;transition:anything .3s; }
.filterBox .collapsed .panel-title .chevron { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.filterBox .checkbox input { border:1px solid #ddd;margin-left:-24px; }
.filterBox .checkbox label { min-height:24px;padding-left:21px; }
.filterBox h3 { font-size: 14px;color:#ee3124;font-weight:700;display:block; }
.filterBox .block { border:1px solid #ddd;border-bottom:none;padding:4px 0 0; }
.filterBox .block p { border-bottom:1px solid #ddd;padding:0 0 0 13px; }
.filterBox p { font-size: 14px;line-height:35px;margin:0; }
.filterBox .closebtn { font-size:16px;color:#111;text-decoration:none;margin:0 -17px 0 0; }
.filterBox ul { list-style:none;overflow:hidden; }
.filterBox li { display:block;padding:5px 0; }
.filterBox li p { line-height:inherit; }
.filterBox li a { display:block;position:relative;font-size: 14px;color:#333;text-decoration:none;padding:0 20px 0 0; }
.filterBox li a.title:after { font-family:FontAwesome;content:"\f104";position:absolute;right:13px;top:5px;font-size: 14px;color:#a7a7a7; }
.filterBox li a.title.active:after { -webkit-transform: matrix(-0.016, -1.000, 1.000, -0.016, 0, 0); -moz-transform: matrix(-0.016, -1.000, 1.000, -0.016, 0px, 0px); -ms-transform: matrix(-0.016, -1.000, 1.000, -0.016, 0, 0); -o-transform: matrix(-0.016, -1.000, 1.000, -0.016, 0, 0); transform: matrix(-0.016, -1.000, 1.000, -0.016, 0, 0); }
.filterBox ul.checkbox { padding: 0px 0px 3px 0px; margin: 0px; overflow: hidden; list-style: none; }
.filterBox ul.checkbox li { padding: 0px; display: block; cursor: pointer; position: relative; font-size: 14px; color:#333333; border: none; }
.filterBox ul.checkbox small { font-size: 13px; }
.filterBox ul.checkbox span { font-size: 13px;color:#111;border-radius:25px; margin-left: 5px; }
.filterBox .checkbox input[type=checkbox]{ display:none; }
.filterBox ul.checkbox li:hover,.filterBox ul.checkbox span:hover,.filterBox .checkbox input[type="checkbox"]:checked+span { color:#0090e2; text-decoration: none; }
.filterBox .checkbox span:before { 
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 20px;
    position: absolute;
    left: 0px;
    top: 1px;
    border: 1px solid #ddd;
    border-radius: 25px;
    color: #111;
}
.filterBox .checkbox input[type=checkbox]:checked+span:before { 
    font-family: FontAwesome;
    font-size: 10px;
    text-align: center;
    line-height: 17px;
    content: "\f00c";
    background: #0090e2;
    color: #fff;
    border: 1px solid #0090e2; }
.filterBox .accordiandetail { overflow:hidden;display:none;padding:10px 0 0; }
.filterBox .accordiandetail.active { display:block; }
.pagingBox { width:100%;overflow:hidden;position:relative;color:#fff;margin:20px 0 10px;padding:0; }
.pagingBox span { font-size: 14px;color:#fff;display:block;float:left;line-height:33px; }
.pagingBox .left { width: calc(100% - 150px); float: left; }
.pagingBox .label { padding: 0 15px; font-size: 14px; color: #111; display: block; float: left; line-height: 30px; font-weight: normal; }
.pagingBox .label:first-child { padding: 0 15px 0 0; }
.filterBox .support-monitor h3 { font-size: 16px; color:#111; margin: 0 0 5px; font-weight: bold; margin-bottom: 5px; }
.filterBox .support-monitor li  {line-height: 15px; }
.filterBox .support-monitor li a { font-size: 14px; color: #111; }
.filterBox .support-monitor li a:hover { text-decoration: underline; }

.filterBox .support-televizori { margin-top: 15px; }
.filterBox .support-televizori h3 { font-size: 16px; color:#111; margin: 0 0 5px; font-weight: bold; margin-bottom: 5px; }
.filterBox .support-televizori li  {line-height: 15px; }
.filterBox .support-televizori li a { font-size: 14px; color: #111; }
.filterBox .support-televizori li a:hover { text-decoration: underline; }

.segment-navigation__back-arrow { padding-right: 5px; }

.icon { fill: #bbb; display: inline-block; height: 10px; vertical-align: middle; width: 10px; }
.icon--arrow { --cb-icon-sizing-height: 10px; --cb-icon-sizing-width: 10px; vertical-align: baseline; }
.icon--rotate-flip { transform: rotate(180deg); }
.icon--color-silver { color: #bbb; }
a.nazad { line-height: 21px; }

@media only screen and (max-width: 1066px) {
    .pagingBox .col.col2.hidden-xs .label { display: none; }

}
@media only screen and (max-width: 1024px) {
    .pagingBox .col.col2.hidden-xs .label { display: block; }
}


@media only screen and (min-width: 476px) {
    .pagingBox .col.col2.hidden-xl .label { display: none; }
}
@media only screen and (max-width: 476px) {
    .pagingBox .col.col2.hidden-xl .label { display: block; }
    .pagingBox .select.big { width: 100% !important; margin-bottom: 10px; }
    .pagingBox .col.col2 { width: 100%; margin-top: 5px; }
    .paging_col { width: 72px !important; }
}

.pagingBox .select { position: relative; width: 60px; height: 30px; line-height: 30px; display: block; float: left; }
.pagingBox .select select { font-size: 13px; text-align: center; width: 100%; padding: 1px 10px 0 5px; height: 30px; color: #111!important; margin: 0; border: 1px solid #ddd; border-radius: 5px!important; background-color: #fff; outline: none; display: inline-block; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; }
.pagingBox .select:after { font-family: 'FontAwesome'; content: "\f107"; background: none; width: 16px; height: 25px; position: absolute; top: 0px; right: 1px; pointer-events: none; color:#111; }
/*.pagingBox .select option { text-align: left; } */

.pagingBox .select.big { width:170px; }
.pagingBox .pagination { float:left;margin:0; }
.pagingBox .pagination ul { list-style:none;margin:0; }
.pagingBox .pagination li { display: inline-block; }
.pagingBox .pagination li.disabled { margin-left: 5px; margin-right: 5px; }


.order-category .button, .button:visited {
    background-color: #00b900;
    border-radius: 5px;
    /*box-shadow: inset 0 -2px 0 0 var(--cb-button-color-shadow);*/
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: inherit;
    font-weight: 700;
    line-height: 1.6rem;
    min-width: 6.4rem;
    outline: none;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    /*transition: background var(--cb-spec-animation-fastest) linear, box-shadow var(--cb-spec-animation-fastest) linear;*/
}



/* Default pagination link style */
.pagingBox .pagination li a {
    width: 30px;
    height: 30px;
    display: block;
    text-align: center;
    line-height: 29px;
    border: 1px solid #ddd;
    background-color: #fff;
    font-size: 14px;
    color: #ddd;
    text-decoration: none;
    border-radius: 5px;
    padding: 0;
    z-index: 1;
}

/* Style for the FIRST li (e.g. current page or "1") */
.pagingBox .pagination li:first-child a {
    font-weight: bold;
}

/* Hover for the FIRST li */
.pagingBox .pagination li:first-child a:hover {
    color: #111;
    border: 2px solid #0090e2;
    background-color: #f2f7fc;
}

/* Hover for all OTHER li items (except active) */
.pagingBox .pagination li:not(:first-child):not(.active) a:hover {
    color: #fff;
    border: 1px solid #0090e2;
    background-color: #0090e2;
}

/* Active li (can appear anywhere) */
.pagingBox .pagination li.active a {
    color: #111;
    border: 2px solid #0090e2;
    background-color: #f2f7fc;
}

.pagingBox .action { position: absolute; right: 0px;  top: 0px; }
.pagingBox .action a { width: 60px; height: 60px; text-align: center; font-size: 22px; color: #111; line-height: 60px; border: 1px solid transparent; float: left; text-decoration: none; }
.pagingBox .action a.active, .pagingBox .action a:hover { color: #111; background-color: #f2f7fc; border: 3px solid #0090e2; border-radius: 5px; font-weight: 700; }
.pagingBox .pagination li a.next { font-size: 18px; }
.pagingBox .col.col2 { float:right; }
.paging_col { width:285px; }

.sticky-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 -1px 10px rgba(0,0,0,0.1);
    z-index: 1000;
    border-top: 1px solid #ddd;
    transform: translateY(100%); /* Initially hide below the viewport */
    transition: transform 0.3s ease-in-out; /* Add transition for the effect */
}

.sticky-footer .skladiste, .sticky-footer span.pdv { display: none; }
.sticky-footer .usps { margin-top: 0px; }
.sticky-footer .product-actions { min-width: 300px; }

.sticky-footer-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px; /* Add some gap between elements */
}

.sticky-footer-inner .product-price { 
    float: right;
    clear: both; 
    text-transform: uppercase;
}

.sticky-footer-inner .energylabel { 
    float: right;
    clear: both;
}


.product-info-wrapper {
    display: flex;
    align-items: center; /* Align image and details vertically */
    gap: 12px; /* Space between image and text */
}

.product-info-wrapper .product-name { 
    margin-bottom: 0px !important;
    color: #111 !important; 
}


.energylabel-price {
    min-width: 220px;
    float: right;
    margin-left: 200px;
    margin-top: 15px;
}

.product-info-wrapper .usps { }
.product-info-wrapper .usps .text-usp { padding-right: 10px; }
.product-info-wrapper .usps .text-usp i { font-size: 16px; }
.product-info-wrapper .usps .text-usp i:before { padding-right: 5px; }

.product-details {
    display: flex;
    flex-direction: column;
    max-width: 390px;
}

.product-actions span.text-usp, .product-actions .check-usp { margin-right: 5px; font-size: 13px; }

.product-actions button#add-to-cart-button { font-size: 15px; font-weight: 700; }

.product-name {
    font-weight: 900;
    font-size: 14px;
    margin-bottom: 4px;
    color: #0090e2;
}

.product-price {
    font-size: 16px;
    font-weight: bold;
    color: #111;
}

.product-actions .btn-add-to-cart {
    background-color: #0075ff;
    color: white;
    border: none;
    padding: 10px 16px;
    font-size: 14px;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.product-actions .btn-add-to-cart:hover {
    background-color: #005fd1;
}

svg.icon.cart-icon {
    color: #fff;
    float: right;
    width: 23px;
    height: 20px;
    margin-top: -4px;
}

.image-footer {
    width: 80px;
    height: 80px;
    /* float: left; Remove float */
    /* clear: both; Remove clear */
}

.mobile-price-sticky, .usp-mobile-bottom { display: none; }

/* Responsive adjustments */
@media (max-width: 600px) {
    .sticky-footer-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 0px;
    }

    .product-info-wrapper {
        flex-direction: row; /* Keep image and text in a row */
        align-items: center;
        width: 100%; /* Take full width */
    }

    .product-details {
        width: calc(100% - 62px); /* Adjust width for image and spacing */
    }

    .product-actions {
        float: right;
        margin-bottom: 10px;
        margin-top: 10px;
        min-width: 100%; 
    }

    .btn-add-to-cart {
        width: 100%;
        text-align: center;
    }
    
    .sticky-footer-inner .energylabel, .energylabel-price, .product-info-wrapper { 
        display: none;
    }
    
    .mobile-price-sticky { 
        display: block;
        float: left;
        padding-right: 20px; 
    }
    
    .image-footer-mobile { float: left; margin-right: 10px; }
    .price-mobile-sticky { float: left; }
    
    .mobile-price-sticky span.current-price-sticky { 
        text-transform: uppercase; 
        font-size: 16px; 
        font-weight: bold; 
        margin-left: 0px;
        color: #111!important;
    }
    
    .mobile-price-sticky .oblique-striketrough { font-size: 16px; font-weight: normal; text-transform: uppercase; color:#666!important; opacity: 0.5; }
    
    .mobile-cart-button { 
        float: right; 
        min-width: 220px;
        margin-top: 4px;
    }
    
    .sticky-footer .product-actions {
        min-width: 100%;
    }
    
    .usp-mobile-bottom {
        display: block;
        float: left;
        position: absolute;
        margin-left: 70px;
        margin-top: 25px; }
    .usp-mobile-bottom span { font-size: 14px!important; font-weight: 900; color:#008500!important; }
    .usp-mobile-bottom i { font-size: 16px; color:#008500!important; }
    
}


@media (max-width: 478px) {
    .mobile-cart-button {
        float: right;
        min-width: 60px;
        margin-top: 4px;
    }
    .cart-text { display: none; }
    svg.icon.cart-icon {
        color: #fff;
        float: right;
        width: 23px;
        height: 20px;
        margin-top: -4px;
        margin-right: 5px;
    }
}

.product { color: #111; font-size: 14px; transition: 0.3s ease-in-out; position: relative; padding-right: 20px; padding-bottom: 75px; margin-bottom: 1.75rem; min-width: 250px; }
.product .uporedi { margin-left: 0px; }
.product .product-image-category { float: left; }
.product .product-info { float:right; }
.product.racunar { padding-bottom: 18px!important; } 
.product .short_description { overflow: hidden; margin-top: 8px;float: left; clear: both; color:#ababab;}
.product .short_description p { color: #ababab; margin-top: 0px; margin-bottom: 0px; }
.product>a:not(.btn) { z-index: 1; width: 100%; height: 100%; outline: none; display: block; overflow: hidden; text-indent: -999px; position: absolute; top: 0; left: 0; font-size: 14px; color:#0090e2; }
.product .btn { 
    right:.75rem;position:absolute;bottom:1.5rem;font-weight:700;text-transform:none;font-size: 14px;padding:.875rem .9375rem;z-index:3;line-height:17px;color:#fff; width: 64px; height: 48px; 
    box-shadow: inset 0 -2px 0 0 #090; }
.product figure { display: -webkit-flex; display: -ms-flexbox; display: flex; min-height: 216px; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 0.625rem; position: relative; margin-right: -1.75rem; margin-left: -1.75rem; }
.product figure img { margin-right: auto; margin-left: auto; }
.product figure span { display: none!important; opacity: 0; width: 85%; display: block; cursor: pointer; text-align: center; transition: 0.3s ease-in-out; color: #333333; background: #fff; padding: 5px; margin: 10px; position: absolute; bottom: 10px; left: 12px; border: 1px solid #fff; border-radius: 25px; }
.product figure .btn-sm, .product figure .btn-sm, .product figure .btn-group-sm>.btn { z-index: 2; padding-right: 1.875rem; padding-left: 1.875rem; position: absolute; bottom: 0; left: 1.75rem; }
.product h4,.product h4 { font-weight:bold; margin-bottom:5px; font-size: 14px; color:#0090e2; }
.product .rating { display:inline-block;margin-bottom:8px; }
.product .review-text { display:inline-block;color:#111;font-size: 14px;padding-left:.3125rem; }
.product .review-text a { color:#ff6348; }
.product .ups { display:block; font-weight:400; color:#008500; font-size: 14px; margin-top:6px; float:left; margin-right: 5px; clear: both; }
.product .ups:before { content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #00b900;
    border-radius: 50%;
    float: left;
    margin-right: 7px;
    margin-top: 7px; }
.product .price{ line-height:1.5;font-weight:700;font-size:16px;margin:5px 0 0; text-transform:uppercase; }
.product .uporedi { clear: both; padding-top: 20px; z-index: 999!important; }
.product:hover { opacity:0.8; }
.product:hover figure a { opacity:0; }
.product:hover figure span { opacity:1; }
.product figure span:after { transition: 0.3s ease-in-out; background-image: url(/game_computer_store/img/angle-right-gray.svg); background-position: center; background-repeat: no-repeat; background-size: 100% 100%; }
.product .compare-item { float: left; clear: both; position: absolute; margin-top: 210px; margin-left: 0px; }
.product-ratings .product-rating{ position:relative;border:1px solid #ddd;margin-bottom:20px; }
.product-ratings .image{height:240px;padding:40px 0; }
.product-ratings .product-rating:hover { cursor:pointer;border:1px solid #353535; }
.product-ratings .product-rating .subtitle{ position:relative;overflow:hidden;text-overflow:ellipsis; white-space:nowrap;font-size: 14px;color:#fff;border-bottom:1px solid #ddd;border-left:2px solid transparent;padding:10px 17px; }
.product-ratings .product-rating:hover .subtitle { background:#0e0e0e;border-left:3px solid #0090e2; }
.assemblyBox .tiles .block.disabled .subtitle { color:#b9b9b9; }
.product-ratings .product-rating img { display:block;width:100%;max-width:120px;height:auto;margin:auto; }
.progress-bar { background-color:#e10717;color:#fff; }
.progress { background-color: #000000; border-radius: 25px; }
.product-ratings .product-rating .rating-wrapper { padding:20px; }
.product-ratings .product-rating .rating-wrapper strong { display:block;font-size: 14px;margin-bottom:10px; }
.product-ratings .product-rating .rating .stars { overflow:hidden; }
.product-ratings .product-rating .rating .stars img { float:left;margin-right:1px; }
.product-ratings .product-rating .settings { overflow:hidden;padding:10px 15px; }
.product-ratings .product-rating .settings strong { font-size: 14px;color:#333;line-height:26px; }
.product-ratings .product-rating .settings strong img { margin-right:10px;display:inline;vertical-align:middle; }
.product-ratings .product-rating .settings strong.ultra,.product-ratings .product-rating .settings strong.max { color:#333; }
.product-ratings .neigrivo { color:#f60;margin-left:10px; }

.product > a.GAE-productclick {
    z-index: 1;
}
.compare-products {
    z-index: 10;
}

.compare-products {
    position: absolute;
    top: 10px;
    right: 20px;
    z-index: 10; /* higher than the .GAE-productclick link */
}

.compare-products .uporedi {
    margin: 0;
    margin-top: 340px;
    margin-left: 136px;
    position: absolute;
}

.compare-products label.checkbox-container {
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
    color: #333;
}

.compare-products input[type="checkbox"] {
    margin-right: 5px;
}

.add-to-cart-btn {
    background-color: #00b200; /* green */
    padding: 10px 12px;
    border: none;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s ease;
}

.add-to-cart-btn:hover {
    background-color: #00b900;
}

.add-to-cart-btn svg {
    width: 25px;
    height: auto;
    fill: #fff;
    margin-right: 0px;
}


a.product-title { color:#0090e2; }
a.product-title:hover { color:#0090e2; text-decoration:underline; }

.product.coolblue-style {
    display: flex;
    /*border: 1px solid #e0e0e0;*/
    border-radius: 5px;
    overflow: hidden;
    padding: 15px;
    margin-bottom: 2rem;
    position: relative;
    background-color: #fff;
    align-items: flex-start; /* Align items vertically at the top */
    padding-top: 0px;
}

.product.coolblue-style .acija-category {
    position: absolute;
    margin-right: 184px;
    margin-top: -60px;
}

.product.coolblue-style .label {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 13px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60;
    display: inline-block;
    padding: .2rem .4rem .4rem;
}

.product.coolblue-style .label--subtle-orange {
    background: #fef1e8;
    color: #f60;
}

.product.coolblue-style .product-left {
    width: 225px;
    margin-right: 15px;
    flex-shrink: 0; /* Prevent image container from shrinking */
}

.product.coolblue-style .image-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.product.coolblue-style .image-container img {
    max-width: 100%;
    height: auto;
}

.product.coolblue-style .product-middle {
    flex-grow: 1; /* Allow middle section to take up available space */
    margin-right: 15px;
    padding-top: 40px;
}

.product.coolblue-style .bullet-list {
    list-style-type: disc;
    padding-left: 2rem;
}

.product.coolblue-style .product-middle .dynamic-highlight__key--with-explanation {
        border-bottom: 1px dashed;
        cursor: default;
    }

.product.coolblue-style h4.product-title {
    display: block;
    font-size: 16px;
    font-weight: bold;
    color: #0090e2;
    margin-bottom: 5px;
    text-decoration: none;
}

.product.coolblue-style h4.product-title:hover {
    text-decoration: underline;
}

.product.coolblue-style .review-product {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    font-size: 14px;
    color: #777;
}

.product.coolblue-style .review-product .rating {
    margin-right: 5px;
}

.product.coolblue-style .review-product .review-text a {
    color: #0090e2;
}

.product.coolblue-style .product-specs {
    /*list-style: none;*/
    padding: 0;
    margin-bottom: 10px;
    font-size: 14px;
    color: #ababab;
    line-height: 17px;
    list-style-type: disc;
    padding-left: 15px;
}

.product.coolblue-style .product-specs li {
    margin-bottom: 3px;
    list-style-type: disc;
    color:#ababab;
    font-size: 13px;
}

.product.coolblue-style .product-right {
    width: 300px;
    flex-shrink: 0; /* Prevent right section from shrinking */
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Align content to the left */
    padding-top: 40px;
}

.product.coolblue-style .product-right .energylabel {
    margin-bottom: 10px;
}

.product.coolblue-style .product-right .energylabel ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-end; /* Align image to the right */
}

.product.coolblue-style .product-right .energylabel img {
    max-width: 54px;
    height: 28px;
}

.product.coolblue-style .product-right .logo-firme {
    max-width: 80px;
    height: auto;
    position: absolute;
    margin-left: 215px;
    margin-top: -2px;
}

.product.coolblue-style .product-right .logo-firme img {
    max-width: 70px;
}

.product.coolblue-style .product-right .stara-cijena {
    text-align: left;
    float: right;
    margin-left: 6px;
    margin-top: -2px;
}

.product.coolblue-style .compare-item { margin-top: 175px; }


.product.coolblue-style .product-right .price-block {
    text-align: left;
    float: left;
}

.product.coolblue-style .product-right strong.current-price {
    float: left;
    clear: both;
}

.product.coolblue-style .product-right .price {
    font-size: 18px;
    font-weight: bold;
    color: #111;
}

.product.coolblue-style .product-right .price .old-price {
    color: #777;
    font-size: 14px;
    text-decoration: line-through;
    clear: both;
    float: right;
    font-weight: 400;
}

.product.coolblue-style .product-right .availability {
    font-size: 14px;
    font-weight: 400;
    margin-top: 5px;
    color: #00b900;
    float: left;
    clear: both;
}

.product.coolblue-style .availability {
    /* Your default availability styles */
    font-size: 14px;
    font-weight: bold;
    margin-top: 5px;
}

.product.coolblue-style .status-ok {
    color: #00b900; font-size: 14px;
}

.product.coolblue-style .status-ok:before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #00b900;
    border-radius: 50%;
    float: left;
    margin-right: 7px;
    margin-top: 6px;
}

.product.coolblue-style .status-not-ok {
    color: #cc0000; /* Red for "Nije na stanju" */
    /* Add any other specific styling for the "out of stock" text */
}

.product.coolblue-style .status-not-ok:before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #cc0000;
    border-radius: 50%;
    float: left;
    margin-right: 7px;
    margin-top: 5px;
}


.product.coolblue-style .product-right .availability.unavailable {
    color: #cc0000;
}

.product.coolblue-style .product-right .add-to-cart-form {
    display: flex;
    justify-content: flex-end;
}

.product.coolblue-style .product-right .add-to-cart-btn {
    background-color: #00b200;
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 10px 15px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 15px;
    transition: background-color 0.3s ease;
    min-width: 285px;
}

.product.coolblue-style .product-right .add-to-cart-btn:hover {
    background-color: #00b900;
}

.product.coolblue-style .product-right .add-to-cart-btn svg {
    width: 25px;
    height: auto;
    fill: #fff;
    text-align: center;
    margin-left: 8px;
    float: right;
}

.product.coolblue-style .product-bottom {
    padding-top: 10px;
}

.product.coolblue-style .product-bottom .compare-products {
    /* Adjust positioning as needed */
}

.mobile-padding-short { margin-top: -8px; }
.add-to-cart-button-homepage { top: 358px; }

/* Mobile Styles */
@media (max-width: 767px) {
    .top-20-home { margin-bottom: -10px !important;} 
    .product.coolblue-style .product-right .stara-cijena {
        position: absolute;
        margin-left: -55px;
        margin-top: -12px;
    }
    .product.coolblue-style .product-right strong.current-price { 
        position: absolute;
        margin-top: -11px;
        margin-left: -133px;
        text-align: right;
    }

    .product.coolblue-style.mobile-layout {
        display: flex;
        flex-direction: column; /* Keep overall stacking */
        /*padding: 10px;*/
        margin-bottom: 1rem;
        align-items: flex-start; /* Align to the left */
        border-bottom: 1px solid #ddd;
        border-radius: 0px;
        min-height: 270px;
    }
    
    .product.coolblue-style .product-right .add-to-cart-btn svg {
        margin-right: 12px;
    }

    .product .btn { margin-top: 50px; min-width: 64px; min-height: 48px; }
    .product .uporedi { margin-top: -80px; }
    .compare-products .uporedi { margin-left: 168px; margin-top: 345px; }
    .product .short_description { margin-top: -8px; }
    .mobile-padding-short { margin-top: -8px; }
    
    .product.coolblue-style .acija-category {
        position: absolute;
        margin-left: -10px;
        margin-top: 30px;
    }
    
    .product.coolblue-style .label {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: "Roboto Slab", serif;
        font-weight: 900;
        font-size: 14px;
        line-height: 21px;
        background-color: #fef1e8;
        border-radius: 5px;
        color: #f60;
        display: inline-block;
        padding: .2rem .4rem .4rem;
    }
    
    .product.coolblue-style .label--subtle-orange {
        background: #fef1e8;
        color: #f60;
    }


    .product.coolblue-style.mobile-layout .mobile-top-section {
        display: flex; /* Image and title/reviews in a row */
        align-items: flex-start; /* Align image and text to the top */
        margin-bottom: 10px; /* Space between top section and price/button */
        width: 100%; /* Take full width */
    }
    
    .add-to-cart-button-homepage {
        background-color: #00b200;
        color: #fff;
        border: none;
        border-radius: 5px;
        padding: 10px 10px;
        font-weight: bold;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 14px;
        transition: background-color 0.3s ease;
        max-width: 50px;
        max-height: 50px;
        height: 50px;
        float: right;
        top: 288px;
    }

    .product.coolblue-style.mobile-layout .product-left {
        width: 120px;
        margin-right: 10px;
        margin-bottom: 0;
        flex-shrink: 0;
    }

    .product.coolblue-style.mobile-layout .image-container {
        display: block;
        width: 100%;
        height: 120px;
        overflow: hidden;
        border-radius: 5px;
    }

    .product.coolblue-style.mobile-layout .image-container img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        max-width: 120px;
        max-height: 120px;
    }

    .product.coolblue-style.mobile-layout .product-middle {
        margin-right: 0;
        padding-top: 0;
        flex-grow: 1; /* Title and reviews take remaining space */
        display: flex;
        flex-direction: column; /* Stack title and reviews */
    }
    
    .product.coolblue-style.mobile-layout .product-middle .product h4, .product h4 {
        margin-top: 22px; font-weight: 900; margin-bottom: 5px; min-height: 33px;
    }
    

    .product.coolblue-style.mobile-layout h4.product-title {
        font-size: 1rem;
        margin-bottom: 2px;
    }

    .product.coolblue-style.mobile-layout .review-product {
        font-size: 0.8rem;
        margin-bottom: 5px;
    }
    
    .product.coolblue-style.mobile-layout .short-desc {
        margin-bottom: 15px;
        padding-bottom: 15px;
        color:#ababab;
    }
    
    .product.coolblue-style.mobile-layout .short-desc p {
        color:#ababab;
    }


    .product.coolblue-style.mobile-layout .energylabel {
        margin-top: 125px;
        margin-bottom: 0px;
        margin-left: -1px;
        position: absolute;
    }

    .product.coolblue-style.mobile-layout .product-specs {
        display: none; /* Hide specs */
    }

    .product.coolblue-style.mobile-layout .product-right {
        width: 100%;
        padding-top: 10px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-top: 10px;
    }

    .product.coolblue-style.mobile-layout .product-right .logo-firme {
        display: none;
    }

    .product.coolblue-style.mobile-layout .product-right .price-block {
        text-align: left;
        margin-top: 0px;
        margin-left: 89px;
    }

    .product.coolblue-style.mobile-layout .product-right .price {
        font-size: 16px;
        margin-left: 172px;
        margin-top: -20px;
    }

    .product.coolblue-style.mobile-layout .product-right .availability {
        font-size: 14px;
        margin-top: 12px;
        margin-left: 42px;
        position: absolute;
    }
    
    .product.coolblue-style.mobile-layout .product-right .add-to-cart-form {
        margin-top: -25px;
    }

    .product.coolblue-style.mobile-layout .product-right .add-to-cart-btn {
        padding: 8px 10px;
        font-size: 0.8rem;
        min-width: auto;
        width: 64px;
        height: 48px;
        box-shadow: inset 0 -2px 0 0 #090;
    }
    
    .product.coolblue-style.mobile-layout .product-right .add-to-cart-btn span {
        display: none;
    }

    .product.coolblue-style.mobile-layout .product-right .compare-item {
        position: static;
        margin-top: 10px;
        margin-left: 0;
        width: 100%;
    }
    
    /*.product.coolblue-style.mobile-layout .product-right .mikrofin-category-mobile { */
    /*    margin-top: 8px;*/
    /*    border: 1px solid #d3e8dc;*/
    /*    border-radius: 4px;*/
    /*    padding: 4px 8px;*/
    /*    font-size: 13px;*/
    /*    color: #2a4832;*/
    /*    display: inline-block;*/
    /*    margin-bottom: 10px;*/
    /*}*/
    
    .product.coolblue-style.mobile-layout .product-right span.rate-pay-mobile {
        position: absolute;
        margin-left: -131px;
        text-transform: none;
        margin-top: 42px;
        font-size: 13px;
        font-weight: normal;
        border: 1px solid #d3e8dc;
        border-radius: 4px;
        padding: 4px 8px;
    }
    
        .product.coolblue-style.mobile-layout .product-right span.rate-pay-mobile p {
        margin: 0;
        line-height: 1.4;
        font-size: 12px;
    }
    
    .product.coolblue-style.mobile-layout .product-right span.price-month {
        font-weight: bold;
        color: #1a7b43;
        text-transform: uppercase;
    }

    .product.coolblue-style.mobile-layout .compare-products {
        position: static;
        display: block;
        margin-top: 5px;
        margin-left: 0;
        text-align: left;
    }

    .product.coolblue-style.mobile-layout .compare-products label.checkbox-container {
        font-size: 0.8rem;
    }
}

@media (max-width: 320px) {
    .product.coolblue-style.mobile-layout .product-right .add-to-cart-form {
        margin-left: -30px;
    }
    .product.coolblue-style.mobile-layout .product-right span.rate-pay-mobile { 
            min-width: 165px;
            text-align: center;
    }
    .product.coolblue-style .product-right .stara-cijena {
        position: absolute;
        margin-left: -133px;
        margin-top: -32px;
    }
}

@media (max-width: 390px) {
    .product.coolblue-style.mobile-layout .energylabel {
        margin-top: 125px;
    }
}
    
/* Desktop Styles - These should remain untouched */
@media (min-width: 768px) {
    .product.coolblue-style {
        display: flex;
    }
    .product.coolblue-style .product-left {
        /* ... other desktop styles ... */
    }
    .product.coolblue-style .product-middle {
        /* ... other desktop styles ... */
    }
    .product.coolblue-style .product-right {
        /* ... other desktop styles ... */
    }
    .product.coolblue-style .compare-item {
        margin-top: 185px;
    }
    .compare-products {
        /* ... other desktop styles ... */
    }
}


@media (max-width: 360px) {
    .product.coolblue-style.mobile-layout .energylabel {
        margin-top: 1305px;
    }
}
    


        /* UPDATED: Changed class name for specificity */
        .compare-card {
            background-color: #ffffff;
            padding: 2rem;
            border-radius: 0.5rem;
            box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
        }

        /* UPDATED: Changed class name for specificity */
        .compare-card-title {
            font-size: 1.125rem;
            font-weight: 600;
            margin-bottom: 1rem;
            color: #1f2937;
        }

        /* --- Toggle Component Styles --- */
        .toggle-label {
            display: inline-flex;
            align-items: center;
            cursor: pointer;
            gap: 0.5rem;
            margin-top: 10px;
        }

        .toggle-text {
            font-size: 0.875rem;
            font-weight: 500;
            color: #ababab;
            user-select: none;
        }

        /* Visually hide the checkbox but keep it accessible */
        .is-visually-hidden {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border-width: 0;
        }

        /* Custom styles for the toggle switch component */
        .switch {
            position: relative;
            display: inline-block;
            width: 36px;
            height: 20px;
            background-color: #e5e7eb;
            border-radius: 9999px;
            transition: background-color 0.2s ease-in-out;
            flex-shrink: 0;
        }

        .switch .handle {
            position: absolute;
            top: 2px;
            left: 2px;
            width: 16px;
            height: 16px;
            background-color: white;
            border-radius: 50%;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
            transition: transform 0.2s ease-in-out;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        /* Checkmark icon styles */
        .handle .checkmark-icon {
            width: 12px;
            height: 12px;
            stroke: #285dab;
            stroke-width: 2.5;
            opacity: 0;
            transition: opacity 0.2s ease-in-out;
        }

        /* Style the switch based on the hidden checkbox's state */
        .is-visually-hidden:checked + .switch {
            background-color: #285dab;
        }

        .is-visually-hidden:checked + .switch .handle {
            transform: translateX(16px);
        }
        
        .is-visually-hidden:checked + .switch .handle .checkmark-icon {
            opacity: 1;
        }


/*@media only screen and (max-width: 767px) {*/
/*        .toggle-text {*/
/*            display: none;*/
/*        }*/
/*}*/


.comment-admin { 
    border-radius: 5px;
    background: #f2f7fc;
    padding-top: 13px;
    padding-right: 8px;
    padding-bottom: 10px;
    padding-left: 18px;
    border-left: 4px solid #0090e2;
}

@media only screen and (max-width: 767px) {
    .product { padding-right: 30px; padding-bottom: 1.5rem; padding-left: 30px; }
    .heading h1 { margin:20px 0 0;clear:both;float:left;font-size:24px;width:100%; }
    .heading p { font-size: 14px; }
    .headwrap  { margin-top: 60px; clear: both; }
    .product.coolblue-style .compare-item { margin-top: 225px; }
}
@media only screen and (max-width: 1024px) {
    /*.product { padding-right: 1.25rem; padding-bottom: 1.5rem; padding-left: 1.25rem; }*/
    .product figure {  
        margin-right: 0px;
        margin-bottom: -44px;
        margin-left: 0px; 
    }
    .product figure .btn-sm, .product figure .btn-sm, .product figure .btn-group-sm>.btn, .product figure .btn-group-sm>.btn { position: absolute; bottom: 0; left: 1.25rem; }
}


.gamedetailBox .spec-list-content { margin: 10px 0px 20px 16px; } 

.gamedetailBox .spec-list-content li {
    margin-bottom: 3px;
    list-style-type: disc;
    color:#666;
    line-height: 17px;
}

.gamedetailBox .spec-list-content li:before { 
    content: "" !important;
    margin-right: 0px !important; 
}


.gamedetailBox .spec-list-content .product-specs span {
        border-bottom: 1px dashed;
        cursor: default;
}


.product .akcija-category {
    position: absolute;
    margin-left: 0px;
    margin-top: -38px;
}


.product .popularno-home {
    position: absolute;
    margin-left: 60px;
    margin-top: -38px;
}

.product .label {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Roboto Slab", serif;
    font-weight: 900;
    font-size: 13px;
    line-height: 21px;
    background-color: #fef1e8;
    border-radius: 5px;
    color: #f60;
    display: inline-block;
    padding: .2rem .4rem .4rem;
}


/* Mobile Styles */
@media (max-width: 767px) {
    .product .akcija-category {
        position: absolute;
        margin-right: 0px;
        margin-top: -22px;
    }
    
    .product .popularno-home  {
        position: absolute;
        margin-right: 0px;
        margin-top: -22px;
    }
    
    .product .label {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: "Roboto Slab", serif;
        font-weight: 900;
        font-size: 13px;
        line-height: 21px;
        background-color: #fef1e8;
        border-radius: 5px;
        color: #f60;
        display: inline-block;
        padding: .2rem .4rem .4rem;
    }
}
    
    
.catalog-product-description { } 
.bottom_optionBox { width:100%;overflow:hidden;margin-bottom:22px;border:1px solid #ddd;padding:1.25rem .9375rem;border-radius:4px}
.bottom_optionBox p { float:left;left:10px;margin:0;position:relative;line-height:47px;text-align:right}
.bottom_optionBox p:before { position:absolute;top:0;font-size:20px;color:#fff}
.bottom_optionBox .btn { float:left;display:inline-block;color:#fff;background:#ddd;position:relative;font-size: 14px;border-radius:25px;padding:16px 30px;border:0}
.bottom_optionBox .btn:before { margin-left:-10px;margin-right:10px;font-family:'FontAwesome';content:"\f104";font-size:14px}
.igre__performanse { border:1px solid #ddd;margin-bottom:.875rem;width:100%;display:block;min-height:61px; }
.igre__performanse .title { float:left;padding:11px; }
.igre__performanse h4 { font-weight:700;margin:0; }
.igre__performanse span { float:right;display:block; }
.igre__performanse .opis-info { float:left;display:block;width:100%;border:1px solid #ddd;margin-bottom:9px; }
.igre__performanse .opis-info p { margin:0;padding:10px; }
.igre__performanse ul { float: right; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-self: stretch; -ms-flex-item-align: stretch; align-self: stretch; margin: 0; }
.igre__performanse ul li { display: -webkit-flex; display: -ms-flexbox;display: flex;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center; transition: 0.3s ease-in-out;border-left: 1px solid #ddd;margin: -1px;position: relative; }
.igre__performanse ul li.r-tabs-state-active { background: #ddd; }
.igre__performanse ul li a { line-height:1;display:block;text-align:center;min-width:9.6875rem;color:#fff;padding:1.4375rem 18px; }
.igre__performanse ul li:hover { z-index:1;background:#ddd;border-color:#ddd; }
@media only screen and (max-width: 767px) {
    .igre__performanse { display:block;min-height:193px; }
    .igre__performanse>div { display:block;text-align:left;float:left;width:100%; }
    .igre__performanse span { float:none;padding:.3125rem 0; }
    .igre__performanse .title { float:left;clear:both;display:block!important; }
    .igre__performanse .title h4 { float:left;width:100%;margin-top:20px; }
    .igre__performanse .title span { float:left;width:100%; }
    .igre__performanse ul li { width:49%;border:1px solid #ddd; }
    .igre__performanse .opis-info { border:none; }
}
@media only screen and (max-width: 1199px) {
    .igre__performanse { display:block; }
    .igre__performanse span { min-width:0; }
    .igre__performanse ul { float:none; }
    .igre__performanse ul li a { padding:.9375rem 18px; }
    .igre__performanse ul li {-webkit-flex: auto;-ms-flex: auto;flex: auto; }
}
.average { border:1px solid #ddd; border-radius: 5px; position:relative;padding:.8125rem 1.25rem; margin-bottom: 5px;  }
.average h4 { font-size:16px;font-weight: 900;margin:0; }
.average p { position: absolute; right: 1.25rem; top: .4125rem; font-size: 15px; margin: 0; margin-top: 3px; }
.average strong {  color: #0090e2; background: #fff; border-bottom: 1px solid #0090e2; font-size: 18px; padding: 4px; }

@media only screen and (max-width: 1024px) {
    
    .filterbtn {
        display: none;
    }

    .floating-filter-btn {
        position: fixed;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        background-color: #285dab;
        color: #fff;
        padding: 12px 20px;
        border-radius: 5px;
        font-weight: bold;
        font-size: 14px;
        z-index: 2;
        box-shadow: inset 0 -2px 0 0 #1e4680;
        display: flex;
        align-items: center;
        gap: 8px;
        text-decoration: none;
        transition: background-color 0.3s ease;
        min-width: 203px;
    }
    
    
    .floating-filter-btn:active,
    .floating-filter-btn:hover,
    .floating-filter-btn:focus {
        background: #1e4680;
        box-shadow: inset 0 -2px 0 0 #036;
        color: #fff;
        text-decoration: none;
    }
    .floating-filter-btn svg {
        width: 20px;
        height: 20px;
        fill: white;
        margin-left: 45px;
    }
    .close-filter-btn {
        background: none;
        border: none;
        font-size: 42px;
        font-weight: 300;
        line-height: 1;
        padding: 0;
        cursor: pointer;
        color: #1d5aa6;
        opacity: 1;
        position: absolute;
        top: 18px;
        right: 30px;
        z-index: 10001;
        text-decoration: none;
    }
    .close-filter-btn:hover {
        color: #15457f;
    }
    .filter-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background-color: rgba(0, 0, 0, 0.4);
        z-index: 9998;
        transition: opacity 0.2s ease-in-out;
        opacity: 0;
        pointer-events: none;
    }

    .filterbox-wrapper.open + .filter-overlay {
        display: block;
        opacity: 1;
        transition: opacity 0.2s ease-in-out;
        pointer-events: auto;
    }

    .filterbox-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #fff;
        z-index: 9999;
        padding: 20px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
        transform: translateY(100%); /* start hidden below */
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
    
    .filterbox-wrapper.active {
        transform: translateY(0); /* slide up */
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
    .filterBox {
        padding: 15px;
        background: #fff;
        color: #111;
        border-radius: 5px;
        border: 1px solid #ddd;
        margin-top: 2px;
    }

    .filterbox-wrapper .input-group-addon {
        text-transform: uppercase;
        padding: 2px 6px;
        color: #111;
        font-size: 14px;
        font-weight: normal;
        line-height: 1;
        text-align: center;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .filterbox-wrapper .range-values .sliderValue {
        border-top-left-radius: 5px !important;
        border-bottom-left-radius: 0;
        height: 35px;
    }

    /* ☁️ Optional inline close icon (if still used) */
    .filterbtn .close-icon {
        float: right;
        vertical-align: middle;
        margin-top: 9px;
    }

    .filterbtn.active .close-icon circle {
        fill: #ffffff;
    }

    body.filter-open {
        overflow: hidden;
        touch-action: none;
    }
}

@media only screen and (min-width: 768px) {
    a.floating-filter-btn,
    .close-filter-panel,
    .close-filter-btn {
        display: none !important;
    }
}

@media only screen and (max-width: 320px) {
    .floating-filter-btn { z-index: 1!important; }
}
@media only screen and (max-width: 1024px) {
    .copyrightBox { padding:10px 0; }
    .copyrightBox .left { margin-right:170px; }
    .copyrightBox .right{top:10px;right:10px; }
}
@media only screen and (max-width: 479px) {
    .tabcontentBox .holder { margin: 0px; }
    .tabcontentBox .tiles .block { width: 100%; margin-right: 0px; }
    .bottomoptionBox { padding:10px; }
    .bottomoptionBox p { line-height:21px;padding-bottom:10px;width:100%;text-align:left; }
    .empty-cart .title { margin:20px 0 20px; }
    .empty-cart .title h1 { font-size:22px;margin:0 0 5px; }
    .empty-cart p { margin:0 0 20px; }
    .method-box .select.small { width:100%;position:relative;margin-top:10px;margin-left:0; }
    .sslBox span { font-size: 14px;margin-top:4px;float:left; }
    .statusbarBox ul.text,.r-tabs .r-tabs-accordion-title { display:none; }
    .btn-continue,.sslBox .ssl-btn { width:100%; }
}
@media only screen and (max-width: 767px) {
    .tabcontentBox .tiles .block { width: calc(50% - 25px); }
    .tabcontentBox .holder { margin-right: -25px; }
    .copyrightBox {  padding-top: 0px; }
    .copyrightBox .left { padding-top: 0px; width: 100%; float: none; }
    .tab-content .rightside { float: inherit; width: 100%; }
    .statusbarBox .bar { padding: 0px 40px; }
}
@media only screen and (max-width: 1159px) {
    .mobile-search .search input { width: 275px; }
}
.imagery img { width:100%; }
.specification { padding-bottom:3.75rem; }
.specification h2 { font-weight:700;margin-bottom:10px; }
.specification h4 { font-weight: 500;margin-bottom:1.25rem;font-size:1.3125rem; }
.specification__block  { width: 100%;display: -webkit-flex;display: -ms-flexbox;display: flex;border-radius: 4px;-webkit-align-items: center;-ms-flex-align: center;align-items: center;border: 1px solid #ddd;padding: 0.8125rem 0.625rem; }
.specification__block p { color:#111;margin:0; }
.specification__block h5 { font-weight:700;margin-bottom:.1875rem;font-size:1rem; }
.specification__block figure { width:28%;max-width:9.6875rem; }
.specification__block figure img { margin-right:auto;margin-left:auto; }
.specification__block>div { width:72%;padding-left:.625rem; }
.specification ul  { display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-bottom: 0; }
.specification ul:before, .specification ul:after { display: none; }
.specification ul li  { display: -webkit-flex;display: -ms-flexbox;display: flex;margin-bottom: 1.25rem; }
.computer { background-size: cover; background-repeat: no-repeat; background-position: center center; }
.computer .row  { display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-align-items: center;-ms-flex-align: center;align-items: center; }
.computer .row:before, .computer .row:after { display: none ; }
.computer .row>div img  { margin-top: -1.875rem;margin-right: auto;margin-left: auto; }
.computer  { background-size: cover;background-repeat: no-repeat;background-position: center center; }
.computer h2 { font-size:36px;font-weight:700;color:#f60; }
.computer h3 { font-size:32px;font-weight:200;margin-bottom:10px; }
.computer p { line-height:21px;color:#111; }
@media only screen and (max-width: 767px) {
    .computer .row { display: block; }
    .computer { padding-top: 1.875rem; }
    .computer .row>div img { margin: 0 auto; }
}
.made{ text-align:center;padding-top:3.125rem;padding-bottom:3.125rem; }
.made h2 { font-weight:700;color:#f60;margin-bottom:10px;font-size:20px; }
.made h4 { font-weight: 500;margin-bottom:1.25rem;font-size:1.4375rem; }
.made span { font-size: 14px; }
.made__block  { width: 100%;display: -webkit-flex;display: -ms-flexbox;display: flex;text-align: left;border-radius: 4px;-webkit-align-items: center;-ms-flex-align: center;align-items: center;transition: 0.3s ease-in-out;border: 1px solid #ddd;padding: 2.0625rem 0.625rem; }
.made__block p { color:#111;margin:0; }
.made__block h5 { font-weight:700;margin-bottom:.1875rem;font-size:1rem; }
.made__block figure { width:24%;max-width:6.25rem; }
.made__block figure img { margin-right:auto;margin-left:auto; }
.made__block>div { width:76%;padding-left:.625rem; }
.made__block:hover { background:#0e0e0e; }
.made ul  { display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;margin-bottom: 0; }
.made ul:before, .made ul:after  { display: none; }
.made ul li  { display: -webkit-flex;display: -ms-flexbox;display: flex;margin-bottom: 1.25rem; }
.parts { background-size:cover;background-repeat:no-repeat;background-position:center center; }
.parts p { margin-bottom:1.4375rem; }
.parts h2 { font-weight:700;color:#f60;margin-bottom:10px; }
.parts h4 { font-weight: 500; }
.parts figure img { margin-right:auto;margin-left:auto; }
.parts__images { margin-top:-1.25rem;margin-bottom:-1.875rem; }
.parts__info { text-align:right;margin-top:1.875rem;margin-bottom:1.875rem; }
.parts .btn { padding-right:2.1875rem;padding-left:2.1875rem; }
.parts .row:before,.parts .row:after { display:none; }
.parts .row { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
@media only screen and (max-width: 767px) {
    .parts__images { margin: 0; }
    .parts__info { text-align: center;  }
    .parts .row { display: block; }
}
.expertise { background-size: cover;background-repeat: no-repeat;background-position: center -12.5rem;padding-bottom: 0px; }
.expertise p { margin-bottom:1.375rem; }
.expertise img { margin-top:-1.875rem;margin-right:auto;margin-left:auto; }
.expertise h2 { font-weight:700;margin-bottom:10px; }
.expertise__text { padding-top:4.8125rem; }
.expertise__text h2 { color:#f60; }
.expertise__block { margin-top:2.6875rem; }
.expertise__block h3 { min-height:5.5rem!important;font-size:1.375rem!important; }
.expertise__block img { margin-top:0; }
.expertise .btn { padding-right:2.5rem;padding-left:2.1875rem; }
.expertise .btn:after{right:1.125rem; }
.expertise .row { margin-bottom:1.25rem; }
@media only screen and (max-width: 479px) {
    .expertise h2 { font-size: 1.5rem; }
}
@media only screen and (max-width: 1024px) {
    .expertise { padding-top: 3.125rem; padding-bottom: 3.125rem}
    .expertise img { margin: 1.875rem auto; }
    .expertise__text { padding: 0; }
    .expertise .row { margin-bottom: 0; }
}
.cookieBox { width:100%;overflow:hidden;padding:20px 0; margin-bottom: 70px; }
.cookieBox h2 { font-size:36px;font-weight:700;line-height:35px;margin:0; }
.cookieBox h2 span { display:block;font-size:16px;font-weight:400;padding:0 0 15px; }
.cookieBox .holder { margin-right: -36px; display: flex;align-items: stretch;flex-flow: row wrap; }
.cookieBox .block { margin-right: 36px;width: calc(50% - 36px);float: left;border: 1px solid #ddd; border-radius: 5px; }
.cookieBox .inputSet  { padding: 22px 25px;display: block;overflow: hidden;border-bottom: 1px solid #ddd;cursor: pointer; }
.cookieBox .inputSet label { margin-bottom:0;padding-left:30px;font-size:22px;position:relative;cursor:pointer;font-weight:700;color:#111; }
.cookieBox .inputSet label input{ opacity:0;position:absolute;cursor:pointer; }
.cookieBox .inputSet label span:before { width: 15px; height: 15px; border: 1px solid #dedede; content: ''; position: absolute; left: 0; top: 4px; background: #000000; border-radius: 100%; cursor: pointer; }
.cookieBox .inputSet label input[type="radio"]:checked~span:after { 
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 100%;
    position: absolute;
    left: 4px;
    top: 8px;
    background: #fff;
    cursor: pointer;
}
.cookieBox .inputSet label input[type="radio"]:checked~span:before { background:#00b900;cursor:pointer;border-color:#00b900; }
.cookieBox .content { overflow:hidden;padding:10px 40px 0 27px; }
.cookieBox p { font-size: 14px;line-height:26px; }
.cookieBox ul { list-style:none;margin:0;padding:0; }
.cookieBox li { position:relative;font-size: 14px;line-height:26px;border-top:1px solid #ddd;padding:12px 0 12px 30px; }
.cookieBox li:before { position:absolute;left:0;top:11px;font-family:FontAwesome;content:"\f058";font-size:18px;color:#19a4ff; }
.browserCookiesBox { width:100%;padding:25px 0; }
.browserCookiesBox .block { overflow:hidden;border:1px solid #ddd;padding:15px 26px; }
.browserCookiesBox .content { padding-right:20px;width:45%;float:left; }
.browserCookiesBox strong { font-size:22px;font-weight:700;display:block; }
.browserCookiesBox p { font-size: 14px;line-height:21px; }
.browserCookiesBox .browser { width:55%;float:left; }
.browserCookiesBox ul {list-style: none;margin: 0px;display: flex;align-items: stretch;flex-flow: row wrap;padding: 0; }
.browserCookiesBox li  { width: 25%;float: left; }
.browserCookiesBox li a  { padding: 24px 0px 16px 0px;width: 100%;display: block;text-align: center;font-size: 14px;line-height: 26px;border: 1px solid #ddd; }
.browserCookiesBox span  { padding-top: 5px;display: block; }
.browserCookiesBox li img  { display: inline-block; }
.browserCookiesBox li a:hover {box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, .05);text-decoration: none; }
.cookiesStepBox  { width: 100%;overflow: hidden}
.cookiesStepBox .step  { width: 100%;overflow: hidden;margin-bottom: 40px;border: 1px solid #ddd; }
.cookiesStepBox h2  { margin: 0px;margin-top: -17px;padding: 16px 35px 8px 17px;font-size: 20px;color: #ffffff;font-weight: 800;position: relative;background: #1fb650;text-align: left; }
.cookiesStepBox .count{ position:absolute;right:17px;bottom:-49px;display:block;font-size:25px;color:rgba(255,255,255,0.6);line-height:135px;font-weight:700; }
.cookiesStepBox .top { overflow:hidden;padding:15px; }
.cookiesStepBox .left { width:228px;float:left; }
.cookiesStepBox .inputSet { display:block;overflow:hidden; }
.cookiesStepBox .inputSet label  { margin-bottom: 8px;padding-left: 30px;font-size: 16px;position: relative;cursor: pointer;float: left;font-weight: 400; }
.cookiesStepBox .inputSet label input { opacity: 0;position: absolute;cursor: pointer; }
.cookiesStepBox .inputSet label span:before  { width: 16px;height: 16px;border: 1px solid #dedede;content: '';position: absolute;left: 0;top: 6px;background: #000000;border-radius: 100%;cursor: pointer; }
.cookiesStepBox .inputSet label input[type="radio"]:checked~span:after  { content: '';width: 8px;height: 8px;border-radius: 100%;position: absolute;left: 4px;top: 10px;background: #fff;cursor: pointer; }
.cookiesStepBox .inputSet label input[type="radio"]:checked~span:before { background:#333;border-color:#fff; }
.cookiesStepBox .right { width:calc(100%-228px);float:left; }
.cookiesStepBox .right p { font-size: 14px;color:#fff;line-height:21px;text-align:left;float:left;margin:0; }
.cookiesStepBox .content { width:100%;overflow:hidden;padding:27px 29px 0 32px; }
.cookiesStepBox .content p { font-size: 14px;color:#333;line-height:21px;margin:0 0 34px;padding:0; }
.cookiesStepBox .content p a { color:#333;text-decoration:underline; }
.cookiesStepBox .content p a:hover { text-decoration:none; }
.cookiesStepBox .content strong { font-size: 14px;display:block; }
.cookiesStepBox .holder { margin-right:-40px;overflow:hidden;border-bottom:1px solid #f4f4f4; }
.cookiesStepBox .holder .block { width:25%;float:left;padding:20px; }
.cookiesStepBox p.title { font-size:17px;color:#1fb650;font-weight:700;margin:0; }
.cookiesStepBox .content:last-child .holder { border:none; }
.cookiesStepBox .step.analyzing h2 { background:#71c9f8; }
.cookiesStepBox .step.analyzing p.title { color:#71c9f8; }
.cookiesStepBox .step.marketing h2 { background:#ff8d57; }
.cookiesStepBox .step.marketing p.title { color:#ff8d57; }
@media only screen and (max-width: 479px) {
    .cookieBox h2 { font-size:21px;line-height:35px; margin-top: 55px; }
    .cookieBox h2 span { font-size: 14px; }
    .cookieBox .block { width:100%!important; }
    .cookieBox .inputSet label { font-size:17px;padding-left:24px;cursor:pointer; padding-top: 5px; }
    .cookieBox .inputSet{cursor:pointer;padding:13px; }
    .browserCookiesBox ul { width:100%; }
    .cookiesStepBox h2 { font-size:30px;display:none;padding:16px 18px 13px; }
    .cookiesStepBox .top { padding:15px; }
    .cookiesStepBox .content { padding:15px 15px 0; }
}
@media only screen and (max-width: 767px) {
    .cookieBox .block { width:100%;margin:0 0 20px; }
    .browserCookiesBox ul { width:300px;margin:0 auto; }
    .browserCookiesBox li { width:50%; }
    .cookiesStepBox h2 { font-size:35px;padding:16px 35px 8px 17px; }
    .cookiesStepBox .inputSet label { margin-right:15px; }
    .cookiesStepBox .count { display:none; }
    .cookiesStepBox .block { width:100%;padding-right:0; }
    .cookiesStepBox .content .block p { margin-bottom:10px; }
    .cookieBox .holder,.cookiesStepBox .holder { margin:0; }
    .cookiesStepBox .left,.cookiesStepBox .right { width:100%; }
}
@media only screen and (max-width: 1024px) {
    .cookieBox .content { padding:10px 22px 0 19px; }
    .cookieBox .holder { margin-right:-15px; }
    .cookieBox .block { margin-right:15px;width:calc(50%-15px); }
    .cookieBox h2 { line-height:46px; }
    .cookieBox h2 span { font-size: 14px;line-height:20px; }
    .browserCookiesBox .content { width:100%;padding-right:0;padding-bottom:15px; }
    .browserCookiesBox .browser { width:100%; }
    .cookiesStepBox .block { width:50%; }
    .cookiesStepBox .right p { font-size: 14px;line-height:25px; }
}
@media only screen and (max-width: 1159px) {
    .cookieBox .holder { margin-right: -22px; }
    .cookieBox .block { margin-right: 22px; width: calc(50% - 22px); }
    .cookiesStepBox .top { padding: 30px; }
    .cookiesStepBox .holder { margin-right: -15px; }
    .cookiesStepBox .block { padding-right: 15px; }
}
.product-header .mobile-assembly-header { margin-top:0; }
.product-header .mobile-assembly-header li { width:25%;text-align:center;height:59px;font-size:12px;padding:0; }
.product-header .mobile-assembly-header li .top { background-color:#333;height:35px;padding-top:5px; font-weight: bold; }

.mobile-assembly-header li a:hover .top { border-bottom:2px solid; }
.mobile-assembly-header li .bottom { border-top:0; }
.mobile-assembly-header li { background-color:#080808; }
.mobile-assembly-header a.btn { float:left; }
.mobile-assembly-header ul li img { height:21px;margin-left:auto;margin-right:auto; }
.mobile-assembly-header ul li a img.is-active,.mobile-assembly-header ul li a:hover img.is-not-active { display:none; }
.mobile-assembly-header ul li a img.is-not-active,.mobile-assembly-header ul li a:hover img.is-active { display:inherit; }
.assemblyBox .tiles .block:hover, .assemblyBox .tiles .block.active  { background-color: #111; border-color: #474747;	color: #111;	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.assemblyBox .tiles .block:hover .subtitle, .assemblyBox .tiles .block.active .subtitle  { background-color: #ddd; border-bottom: 1px solid #474747;color: #fff; }

.slider_dotted {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: -6px; /* Adjust the distance from the bottom */
    left: 50%;
    transform: translateX(-50%);
    padding-top: 0;
    list-style-type: none;
    margin: 0;
    padding: 20px;
}

.slider_dotted li {
    background: #fff;
    cursor: pointer;
    width: 17px;
    height: 17px;
    padding: 10px;
    display: inline-block;
    border: 1px solid #ddd;
    border-radius: 25px;
    transition: 0.3s ease-in-out;
    margin-right: 3px;
}

.slider_dotted li.active {
    background: #fff;
    border: 1px solid #0090e2;
    transition: 0.3s ease-in-out;
}

.slider_dotted li button {
    display: none;
}

@media (max-width: 479px) {
    .media {
        padding: 18px;
    }
    .productSliderVertical .gallery img {
        max-width: 350px!important;
        margin-bottom: 20px;
    }
    .slick-track { margin-bottom: 15px; } 
}

@media (max-width: 767px) {
    .slider_dotted {
        right: 25%; /* Adjust horizontal position for mobile */
        display:none; 
    }
    .media {
        padding: 18px;
    }
    .popupBox .productSliderVertical .gallery img {
        max-width: 330px!important;
    }
}


div#opis-proizvoda, div#recenzije, div#specifikacije, div#mikrofin { position:relative; width:100%; padding:10px 0px 20px 0px; border:1px solid #fff;position:relative;margin-bottom:20px;border-radius:5px}

#opis-proizvoda ul {
  list-style: none;
  padding-left: 0;
}

#opis-proizvoda ul li::before {
  content: "✔";
  color: #0a74da;
  margin-right: 10px;
}

.reviews-limited .btn.all-reviews { margin-top:-12px; }
.reviewform .form-control-feedback { font-size:25px;padding-top:13px; }
.category { padding-top:0px;padding-bottom:0px; }
.category img { margin-right:auto;margin-left:auto; }
.category .btn { display:block;margin-top:1.25rem; }
.category ul { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 0; }
.category ul li { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 1.5625rem; }
.category__block { width: 100%; transition: 0.3s ease-in-out; }
.category__block:hover { transition: 0.3s ease-in-out; }
.category__block { width: 100%; transition: 0.3s ease-in-out; }
.category__block a { font-size: 14px; }

.externi-review { 
    display: inline-flex;
    align-items: center;
    background-color: #fef3e1;
    border-radius: 16px;
    padding: 5px 10px;
    border: 1px solid #fdebc8;
}

@media only screen and (max-width: 479px) {
    .category .btn{height:auto;font-size:1rem;padding-right:.625rem;padding-left:.625rem; }
}
@media only screen and (max-width: 767px) {
    .category ul li { width: 100%; }
}
.parts .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.parts .slick-list{ position:relative;overflow:hidden;display:block;margin:0;padding:0; }
.parts .slick-list.dragging{cursor:hand; }
.parts .slick-slider .slick-track,.parts .slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0); }
.parts .slick-track{ position:relative;left:0;top:0;display:block; }
.parts .slick-track:before,.parts .slick-track:after { content:"";display:table; }
.parts .slick-track:after { clear:both; }
.parts .slick-slide { float:left;height:100%;min-height:1px;display:none; }
[dir="rtl"] .parts .slick-slide { float:right; }
.parts .slick-slide.dragging img { pointer-events:none; }
.parts .slick-vertical .slick-slide { display:block;height:auto;border:1px solid transparent; }
.parts .slick-list:focus,.parts .slick-slider .slick-slide,.parts .slick-slider .slick-slide:focus{outline:none; }
.parts .slick-loading .slick-track,.parts .slick-loading .slick-slide{visibility:hidden; }
.parts .slick-slide img,.parts .slick-initialized .slick-slide { display:block; }
.parts .slick-slide.slick-loading img,.parts .slick-arrow.slick-hidden { display:none; }
.parts .slick-slider .slick-arrow {	z-index: 2;opacity: 0.5;border: 0 none;	width: 2.125rem;overflow: hidden;height: 3.625rem;text-indent: -999px;-webkit-transform: translateY(-50%); transform: translateY(-50%);transition: 0.3s ease-in-out;background-color: transparent;position: absolute; top: 50%; }
.parts .slick-slider .slick-arrow.slick-prev {left: 0;background-image: url(/game_computer_store/img/slider-prev.svg);background-position: center;background-repeat: no-repeat;background-size: 100% 100%; }
.parts .slick-slider .slick-arrow.slick-next {right: 0;background-image: url(/game_computer_store/img/slider-next.svg);background-position: center;background-repeat: no-repeat;background-size: 100% 100%; }
.parts .slick-slider .slick-arrow:hover { opacity: 1; }
.parts .slick-slider .slick-dots  { text-align: center;margin: 0; }
.parts .slick-slider .slick-dots li {cursor: pointer;width: 0.9375rem;height: 0.9375rem;	display: inline-block;border: 1px solid #ddd;margin-right: 2px;margin-left: 2px; }
.parts .slick-slider .slick-dots li button { display:none; }
.parts .slick-slider .slick-dots li.slick-active { background:#fff;border-color:#fff; }
.specification { background:#121212;padding:35px 0; }
.specification h2 { font-weight:700;margin-bottom:5px;font-size:26px; }
.specification h4 { font-weight:200;margin-bottom:15px;font-size:18px;color:#111; }
.specification__block { width:100%;display:flex;border-radius:4px;-webkit-align-items:center;-ms-flex-align:center;align-items:center;border:1px solid #ddd;padding:.8125rem .625rem; }
.specification__block:hover { border:1px solid #3e3e3e; }
.specification__block p { color:#111;margin:0; }
.specification__block h5 { font-weight:700;margin-bottom:.1875rem;font-size:1rem; }
.specification__block figure { width:28%;max-width:9.6875rem; }
.specification__block figure img { margin-right:auto;margin-left:auto; }
.specification__block>div { width:72%;padding-left:.625rem; }
.specification ul { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 0; }
.specification ul:before, .specification ul:after {	display: none; }
.specification ul li  { display: -webkit-flex;display: -ms-flexbox;display: flex;	margin-bottom: 1.25rem; }
@media only screen and (max-width: 767px) {
    .specification { padding-bottom:1.25rem; }
}
.made { text-align:center;padding-top:10px;padding-bottom:10px; }
.made h2 { font-weight:700;color:#f60;margin-bottom:10px;font-size:26px; }
.made h4 { font-weight: 500;margin-bottom:15px;font-size:18px; }
.made span { font-size: 14px;color:#111; }
.made span strong { color:#fff; }
.made__block  { width: 100%; display: -webkit-flex;	display: -ms-flexbox;display: flex;	text-align: left;	border-radius: 4px;-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;transition: 0.3s ease-in-out;border: 1px solid #ddd;	padding: 2.0625rem 0.625rem; }
.made__block p { margin:0; }
.made__block h5 { font-weight:700;margin-bottom:.1875rem;font-size:1rem; }
.made__block figure { width:24%;max-width:6.25rem; }
.made__block figure img { margin-right:auto;margin-left:auto; }
.made__block>div { width:76%;padding-left:.625rem; }
.made__block:hover { background:#0e0e0e; }
.made ul  { display: -webkit-flex;display: -ms-flexbox;display: flex;	-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;margin-bottom: 0}
.made ul:before, .made ul:after { display: none; }
.made ul li  { display: -webkit-flex;	display: -ms-flexbox;display: flex;	margin-bottom: 1.25rem; }
.parts  { background-size: cover;	background-repeat: no-repeat;background-position: center center; }
.parts p { margin-bottom:1.4375rem; }
.parts h4 { font-weight: 500; }
.parts figure img { margin-right:auto;margin-left:auto; }
.parts__images { margin-top:-1.25rem;margin-bottom:-1.875rem; }
.parts__info { text-align:right;margin-top:1.875rem;margin-bottom:1.875rem; }
.parts .btn { padding-right:2.1875rem;padding-left:2.1875rem; }
.parts .row { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.parts .row:before, .parts .row:after {	display: none; }
@media only screen and (max-width: 767px) {
    .parts__images { margin: 0; }
    .parts__info { text-align: center; }
    .parts .row { display: block; }
}
.expertise { background-size: cover; background-repeat: no-repeat; background-position: center -12.5rem; padding-bottom: 6.875rem; }
.expertise p { margin-bottom:1.375rem;color:#111; }
.expertise img { margin-top:-1.875rem;margin-right:auto;margin-left:auto; }
.expertise h2 { font-weight:700;margin-bottom:10px; }
.expertise__text { padding-top:4.8125rem; }
.expertise__text h2 { color:#f60;font-weight:700; }
.expertise__block { margin-top:2.6875rem; }
.expertise__block h3 { min-height:5.5rem!important;font-size:1.375rem!important; }
.expertise__block img { margin-top:0; }
.expertise .btn { padding-right:2.5rem;padding-left:2.1875rem; }
.expertise .btn:after{right:1.125rem; }
.expertise .row { margin-bottom:1.25rem; }
@media only screen and (max-width: 1024px) {
    .expertise { padding-top:3.125rem;padding-bottom:3.125rem; }
    .expertise .row { margin-bottom:0; }
    .expertise img { margin:1.875rem auto; }
    .expertise__text { padding:0; }
}
@media only screen and (max-width: 479px) {
    .expertise h2 { font-size: 1.5rem; 	}
}
.oblique-striketrough {	position: relative; font-weight: 400; opacity: 0.5; color:#666; }
.oblique-striketrough:before { position: absolute; content: ""; left: 0; top: 50%; right: 0;  border-top: 2px solid; border-color: inherit; -webkit-transform: rotate(-13deg); -moz-transform: rotate(-13deg); -ms-transform: rotate(-13deg); -o-transform: rotate(-13deg); transform: rotate(-13deg); }
.fb_dialog.fb_dialog_advanced{right:18pt;margin-right:95px; }
iframe.fb_customer_chat_bounce_in_v2,iframe.fb_customer_chat_bounce_out_v2{right:9pt;margin-right:95px; }
.product-infopage-review>div {transition: 0.3s ease-in-out;	border: 1px solid #ddd;padding: 2.0625rem 0.625rem; text-align: left; }
.product-infopage-review>div:hover { background: #0e0e0e; }
.product-infopage-review div.clearfix { border-bottom: 1px solid #ddd; margin-top: 3px; margin-bottom: 3px; }
.advant { background-size:cover;background-repeat:no-repeat;background-position:center -12.5rem;padding-bottom:0;margin-top:20px; }
.advant p { margin-bottom:1.375rem; }
.advant img { margin-top:-1.875rem;margin-right:auto;margin-left:auto; }
.advant h2 { font-weight:700;margin-bottom:10px;color:#f60!important; }
.advant__text { padding-top:4.8125rem; }
.advant__text h2 { color:#f60; }
.advant__block { margin-top:2.6875rem; }
.advant__block h3 { min-height:5.5rem!important;font-size:1.375rem!important; }
.advant__block img { margin-top:0; }
.advant .btn { padding-right:2.5rem;padding-left:2.1875rem; }
.advant .btn:after{right:1.125rem; }
.advant .row { margin-bottom:1.25rem; }
@media only screen and (max-width: 479px) {
    .advant h2 { font-size: 1.5rem; }
}
@media only screen and (max-width: 1024px) {
    .advant { padding-top:3.125rem;padding-bottom:3.125rem; }
    .advant img { margin:1.875rem auto; }
    .advant__text { padding:0; }
    .advant .row { margin-bottom:0; }
}
.new-review { background-color:#ddd;border:1px solid #414141;border-radius:3px;margin-bottom:10px;padding:10px; }
.new-review strong { color:#fff;font-size:16px;font-weight:700;float:left;width:100%; }
.new-review p { color:#c4c4c4;margin:0!important;padding:0!important; }
.new-review a { color:#fff;font-size:16px;font-weight:700;text-decoration:none; }
.new-review .ratings { float:right;margin-top:-24px; }
.alle-reviews { margin-bottom:100px; }
.storing { border:1px solid #e74c3c;padding:20px; }
.storing p { color:#e74c3c;font-size:16px; }
.notification { border:1px solid grey;padding:9px; }
.notification p { color:#e74c3c;font-size:16px;text-align:center;margin:0!important; }
.collapse { display:none;width:100%; }
.collapse.in { display:block;width:100%; }
.item_options { width:100%; min-width:350px; }
.item_options li { font-size:12px;color:#c4c4c4;border-top:1px solid #ddd; }

@media only screen and (max-width: 479px) {
    .item_options { width:100%; min-width:300px; }
}
#btn-blackbutton,.btn-blackbutton,.btn-blackbutton a,a.btn-blackbutton { background-color:#00000!important;color:#fff!important;border-color:#00000!important; }
.popupBox .popup { padding-top:100px;position:relative;z-index:4; }
.popupBox .head { background:#111;top:0;width:100%;z-index:2000; }
.popupBox .head h2 { background:#ddd;width:100%;z-index:2000;font-size:18px;padding:20px; }
.popupBox .close-btn {
    background: none;
    border: none;
    font-size: 46px;
    font-weight: 300;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    color: #0090e2;
    opacity: 1;
    position: absolute;
    top: 10px;
    right: 10px;
    text-decoration: none;
}
.popupBox .close-btn:hover { color: #0090e2; opacity: 0.7; }
.popupBox .sticky-wrapper { margin-top:97px; }
.popupBox .modal-body { margin-top:82px; }
.popupBox .tabBox { width:100%;min-height:400px; }
.tabBox .tab-content { padding:0; }
.tab-content>.active { display:block; }
.modal.fade.undefined.in { background-color:rgba(0,0,0,0.4); }
.modal .modal-content { border-radius:4px; }
.modal .modal-body .breadcrumbBox,.modal .modal-body .kb-s-form,.modal .modal-body .itemBox { display:none; }
.modal .modal-header { border:0;border-top-left-radius:3px;border-top-right-radius:3px;padding-bottom:10px; }
.modal .modal-header h1,.modal .modal-header h2,.modal .modal-header h3,.modal .modal-header h4,.modal .modal-header h5,.modal .modal-header h6,.modal .modal-header .modal-title { color:#285dab; font-size: 24px; font-weight:bold; line-height:21px; margin:0; padding: 0px; font-family: "Roboto Slab", serif; }
.modal .modal-header button.close { display:block;position:absolute;right:0;top:5px;width:58px;height:58px;text-align:center;font-family:FontAwesome, sans-serif;font-size:26px;line-height:0;color:#0090e2;opacity:1;margin:0; }
.modal .modal-header p { margin:0; }
.modal .modal-body { padding:15px; }
.modal .modal-body iframe,.modal .modal-body>*{max-width:100%;font-size: 14px;line-height:21px; }
.modal .modal-body .container { width:auto; }
.modal .modal-dialog.modal-lg { width:100%;margin:0; }
.modal .modal-dialog.modal-lg .modal-body>*{max-width:1170px;margin:0 auto; margin-bottom: 20px; }

@media only screen and (max-width: 479px) {
    .modal-wrapper.no-footer { min-height: 900px; }
}

.modal-wrapper.no-footer .simple_contact_form { font-size: 14px;padding:30px; }
.modal-wrapper.no-footer .simple_contact_form .form-group { margin-bottom:9px;overflow:hidden; }
.modal-wrapper.no-footer .simple_contact_form .form-button { margin:10px; }
.modal-wrapper.no-footer .simple_contact_form h3 { font-size:16px;margin:0 0 23px; }
.modal-wrapper.no-footer .simple_contact_form p { margin-bottom:22px; }
.modal-wrapper.no-footer .simple_contact_form h1 { font-size:22px;font-weight:700; }
.modal-wrapper.no-footer .simple_contact_form h2 { font-size:21px;font-weight:700; }
.modal-container { min-height: 650px!important; background-color: #fff; color:#111; }
.modalDialogOpen { text-decoration: underline; }

.ambilight-picture {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  margin-bottom: 20px;
}

.ambilight-img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}


/* Default: enable zoom on desktop */
.image-zoom img {
    transition: transform 0.3s ease;
    width: 100%;
    height: 100%;
}

.image-zoom:hover img {
    transform: scale(1.5);
}

/* Disable zoom for desktop */
@media (min-width: 768px) {
    .image-zoom img {
        transition: none;
    }

    .image-zoom:hover img {
        transform: none;
    }
}



@media only screen and (max-width: 1024px) {
    .popupBox .head h2 { font-size:20px;line-height:32px;padding-top:7px; }
    .modal .modal-header h1 { font-size:18px;line-height:32px;padding-top:7px; }
}
@media only screen and (max-width: 479px) {
    .popupBox .head h2,.modal .modal-header h1 { font-size: 14px;line-height:28px;padding-top:11px; }
    .modal .modal-content { margin: 0px; }
    .popupBox .head { margin-top: 50px; }
}
@-webkit-keyframes zoom, @keyframes zoom {
    0% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); }
}
@-webkit-keyframes tada {
    0%, 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
    30% { -webkit-transform: scale3d(.75, 1.25, 1); transform: scale3d(.75, 1.25, 1); }
    40% { -webkit-transform: scale3d(1.25, .75, 1); transform: scale3d(1.25, .75, 1); }
    50% { -webkit-transform: scale3d(.85, 1.15, 1); transform: scale3d(.85, 1.15, 1); }
    65% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); }
    75% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); }
}
@keyframes tada {
    0%, 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
    30% { -webkit-transform: scale3d(.75, 1.25, 1); transform: scale3d(.75, 1.25, 1); }
    40% { -webkit-transform: scale3d(1.25, .75, 1); transform: scale3d(1.25, .75, 1); }
    50% { -webkit-transform: scale3d(.85, 1.15, 1); transform: scale3d(.85, 1.15, 1); }
    65% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); }
    75% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); }
}
@-webkit-keyframes jelly {
    0%, 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
    30% { -webkit-transform: scale3d(.75, 1.25, 1); transform: scale3d(.75, 1.25, 1); }
    40% { -webkit-transform: scale3d(1.25, .75, 1); transform: scale3d(1.25, .75, 1); }
    50% { -webkit-transform: scale3d(.85, 1.15, 1); transform: scale3d(.85, 1.15, 1); }
    65% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); }
    75% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); }
}
@keyframes jelly {
    0%, 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
    30% { -webkit-transform: scale3d(.75, 1.25, 1); transform: scale3d(.75, 1.25, 1); }
    40% { -webkit-transform: scale3d(1.25, .75, 1); transform: scale3d(1.25, .75, 1); }
    50% { -webkit-transform: scale3d(.85, 1.15, 1); transform: scale3d(.85, 1.15, 1); }
    65% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); }
    75% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); }
}
@-webkit-keyframes rotate {
    0% { opacity: 0; -webkit-transform: translateZ(-200px) rotate(-45deg); transform: translateZ(-200px) rotate(-45deg);  }
    100% { opacity: 1; -webkit-transform: translateZ(0) rotate(0); transform: translateZ(0) rotate(0); }
}
@keyframes rotate {
    0% { opacity: 0; -webkit-transform: translateZ(-200px) rotate(-45deg); transform: translateZ(-200px) rotate(-45deg); }
    100% { opacity: 1; -webkit-transform: translateZ(0) rotate(0); transform: translateZ(0) rotate(0); }
}
@-webkit-keyframes pulse {
    0% { box-shadow: 0 0 0 0 #bdc3c7; }
    100% { box-shadow: 0 0 0 1.5em rgba(189, 195, 199, 0); }
}
@keyframes pulse {
    0% { box-shadow: 0 0 0 0 #bdc3c7; }
    100% { box-shadow: 0 0 0 1.5em rgba(189, 195, 199, 0); }
}

.loadingImage { display: block; margin: auto; margin-top:240px; margin-bottom:200px; }
.bor1 { border-radius: 1px!important; }
.bor2 { border-radius: 2px!important; }
.bor3 { border-radius: 3px!important; }

.gamePcAdviceHeader{ background:#333 url(/game_pc/img/game-pc-kopen-header.jpg) no-repeat left 70px;background-size:cover;background-attachment:fixed;height:210px;padding-top:30px; }
.gamePcAdviceHeader{ background:#333 url(/game_pc/img/game-pc-kopen-header.jpg) no-repeat left 70px;background-size:cover;background-attachment:fixed;height:210px;padding-top:30px; }
.gamePcAdviceHeader h1 { font-weight:bold; font-size: 27px; margin-top: 35px; color: #ffffff; float:left; margin-bottom: 0px; }
.gamePcAdviceHeader h2 { }
.gamePcAdviceHeader h4 { margin-top: 14px; color: #ffffff; float:left; clear: both; font-weight: normal; font-size: 17px; line-height: 23px; padding-right: 90px; margin-top: 5px;}
.gamePcAdviceHeader .logo { max-width: 100px; -webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(-22deg);margin-top:38px;margin-right:8px; clear: both;
    float: left; }

@media only screen and (max-width: 767px) {
    .kies-op-game-logo { max-width: 60px; float:left; }
    .kies-op-game-logo img { float: left; max-width:100px; float:left; }
    .gamePcAdviceHeader { height: 385px; padding-top: 70px !important;     background: #333 url(/game_pc/img/game-pc-kopen-header.jpg) no-repeat left -270px top 10px; background-size:cover; }
    .gamePcAdviceHeader h1 { font-size: 24px; margin-bottom: 0px; float:left; margin-top: 15px; }
    .gamePcAdviceHeader h4 { margin: 10px 0px 10px 0px; float: left; font-size: 14px; font-weight: normal; line-height: 16px; padding-right: 0px;  }
    #gpaAdviceBox #gpaDefinitionRadio .info { width: 100%!important; }
    #gpaAdviceBox #gpaDefinitionRadio .buttons { width: 100%; }
    .upsBoxhead li{width:100%;}
    #gpaOptionsBox h4 { font-size: 16px!important; }
    #gamePcAdvice h3 { font-size: 14px!important; }
    #gpaAdviceBox #gpaDefinitionRadio .buttons label { min-width: 50%!important; }
    .gpaTopBar .inner h3 { margin: 20px 0px 0px 0px!important; font-size: 19px!important;  }
} 

@media only screen and max-width 991px {
    .upsBoxhead li { width:50%; padding-bottom:5px; font-size: 14px!important; }
    .upsBoxhead .pull-right { float:none!important; }
    .upsBoxhead { padding:15px 0; }
}

@media only screen and max-width 479px {
    .upsBoxhead li{ width:100%; padding-bottom:5px; font-size: 14px!important; }
    .upsBoxhead{ border-bottom:1px solid #ddd;width:100%;overflow:hidden;padding:0 0 23px; }
}

#gamePcAdvice{background:#111;margin-top:-20px; margin-bottom: 100px; border:1px solid #ddd; border-radius: 5px; min-height:550px;padding:20px;}
#gamePcAdvice h3 { background:#111;color:#fff;font-size:17px;font-weight: 900;margin:0;padding:10px 0px 10px 0px;}
#gamePcAdvice h2 { background:#111;color:#fff;font-size:17px;font-weight: 900;margin:0;padding:20px 0px 0px 19px;}

a.showAllGames {
    margin-top:2px;
    cursor: pointer;
}

#gpaDesktop #gpaGamesList {
    position: relative;
    float: left;
    width: calc(80% - 1px);
}
#gpaDesktop #gpaGamesScrollBox {
    overflow: hidden;
    width: 100%;
}

#gpaDesktop #gpaGamesList:not('.showAllGames') #gpaGamesScrollBox {
    height: 224px;
}

#gpaDesktop #gpaGamesPrev {
    position: absolute;
    font-size: 60px;
    color: #808080;
    cursor: pointer;
    font-weight: 400;
    top: 70px;
    left: calc(-100px - 20%);
}

#gpaDesktop #gpaGamesNext {
    position: absolute;
    font-size: 60px;
    color: #808080;
    cursor: pointer;
    font-weight: 400;
    top: 70px;
    right: -70px;
}

#gpaDesktop #gpaGamesList ul { position: relative; list-style-type: none; margin: 0; padding: 0; }
#gpaDesktop #gpaGamesList .list { width: 300%; }
#gpaGamesList.showAllGames ul li { display: inline-block; }
#gpaDesktop #gpaGamesNext:hover, #gpaGamesPrev:hover { color: #000; }
#gpaDesktop #gpaGamesList .item { position: relative; float: left; width: 214px; height: 214px; overflow: hidden; margin: 5px; padding: 0; border: 1px solid #ddd; border-radius: 5px; text-align: center; scrollbar-color: rgba(86, 86, 86, 1) #111; }
#gpaDesktop #gpaGamesList .item:hover { box-shadow: 0 0 8px rgba(0,0,0,0.1); opacity: 0.8; border: 1px solid #4e4e4e; border-radius: 5px; }
#gpaDesktop #gpaGamesList .item .title { text-align: left; border-bottom: 1px solid #ddd; line-height: 40px; padding-left: 10px; }
#gpaDesktop #gpaGamesList h5 { line-height: 20px; margin-top: 13px; }
#gpaDesktop #gpaGamesList .item .title a { float: right; line-height: 40px; margin-right: 10px; font-size: 18px; color: #d6d6d6; text-decoration: none; }
#gpaDesktop #gpaGamesList .item .title a:hover { color: #3f3f3f; }
#gpaDesktop #gpaGamesList .item .image { height: 120px;   margin: 14px auto 0 auto; }
#gpaGamesList .item .checkbox{position:absolute;bottom:-5px;right:5px;margin:0;padding:0;}
#gpaGamesList .item .checkbox .pretty{float:right;}

.gpaPopup .back{position:fixed;width:100%;height:100%;top:0;bottom:0;left:0;right:0;z-index:9999998;background:#000;opacity:0.9;}
.gpaPopup .front{position:fixed;width:60%;height:80%;top:10%;bottom:10%;left:20%;right:20%;z-index:9999999;background:#fff;border-radius:8px;overflow-y:scroll;}
.gpaPopup .closeLink{position:fixed;top:calc(10%-50px);right:calc(20%-50px);font-size:50px;color:#fff;}
.gpaPopup .closeLink:hover{color:#ccc;text-decoration:none;}
.gpaPopup .front .inner{padding:40px;}
.gpaPopup .individual-star-ratings{margin:60px 20px 0 0;}
.gpaPopup .divider{height:75px;}
.gpaLeftBar { width: 400px; margin: 20px 20px 0 0; float: left; }

#gpaDesktop .gpaStep2 { margin-bottom: 20px; }
#gpaDesktop .gpaStep4 { }
#gpaDesktop #gpaGamesSelectedBox { float: left; width: calc(20% - 22px); height: 214px; margin: 5px 15px 5px 0px; padding: 0; border: 1px solid #ddd; border-radius: 5px; }
#gpaDesktop #gpaGamesSelectedBox:hover { box-shadow:0 0 8px rgba(0,0,0,0.1);}
#gpaDesktop #gpaGamesSelectedBox .title { border-bottom:1px solid #ddd;padding:10px 1px 10px 10px;}
#gpaDesktop #gpaGamesSelectedBox .list { width:100%;max-height:172px;overflow-x:hidden;overflow-y:scroll;margin:0;padding:0; scrollbar-color: rgba(86, 86, 86, 1) #111; }
#gpaDesktop #gpaGamesSelectedBox .list .item { border:1px solid #ddd;font-size: 14px;line-height:20px;border-radius:4px;margin:6px;padding:8px; }
#gpaDesktop #gpaGamesSelectedBox .list .item:hover { background:#ddd;}
#gpaDesktop #gpaGamesSelectedBox .list .item a { float:right;line-height:20px;text-decoration:none;}
#gpaMobile #gpaGamesList .list { list-style-type:none;margin:0;padding:0;}
#gpaMobile #gpaGamesList .item { position: relative; height: 192px; width: 100% !important; float: left; text-align: center; border: 1px solid #ddd; margin: 5px 0px 5px 0px; }
#gpaMobile #gpaGamesList .item .title{font-size:16px;border-bottom:1px solid #ddd; margin: 10px 0px 10px 0px;  }
#gpaMobile #gpaGamesList .item .title h5 { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#gpaMobile #gpaGamesList .item .title p { max-width: 50px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#gpaMobile #gpaGamesList .item .title a{float:right;line-height:0;font-size:18px; color:#d6d6d6; text-decoration:none;margin:-17px 10px 10px 10px;}
#gpaMobile #gpaGamesList .item .title a:hover { text-decoration: none; }
#gpaMobile #gpaGamesList .item.col100 { width: calc(100% - 10px); }
#gpaMobile #gpaGamesList .item.col50 { width: calc(50% - 10px); }
#gpaMobile #gpaGamesList .item.col33 { width: calc(33% - 10px); }
#gpaMobile #gpaGamesList .item.col25 { width: calc(25% - 10px); }
#gpaMobile  #gpaGamesList .item .image { margin-left:40%; max-width: 70px; border-radius: 5px; }
#gpaMobile #gpaGamesSelectedBox { border: 1px solid #ddd; margin:0px; padding: 10px; }
#gpaMobile #gpaGamesSelectedBox .list { list-style-type: none; margin: 0; min-height: 150px; padding: 10px 20px 10px 0px; min-height: 100px; }
#gpaMobile #gpaGamesSelectedBox .list .item {  display: inline; float: left; padding: 10px; width: 100%; padding: 10px; }
#gpaMobile #gpaGamesSelectedBox .list .item a { line-height:20px; text-decoration: none; }
#gpaMobile #gpaGamesSelectedBox:hover { box-shadow: 0 0 8px rgba(0,0,0,0.1); }
#gpaMobile #gpaGamesSelectedBox .title { padding: 10px; border-bottom: 1px solid #ddd; }
#gpaMobile #gpaGamesSelectedBox .list { width: 100%; height: 170px; margin: 0; padding: 0; overflow-x: hidden; overflow-y: scroll; }
#gpaMobile #gpaGamesSelectedBox .list { list-style-type: none; margin: 0; padding: 0 10px 20px 10px; height: 50px; }
#gpaMobile #gpaGamesSelectedBox .list .item { margin: 6px; border: 1px solid #ddd; font-size: 14px; line-height: 20px; border-radius: 4px; }
#gpaMobile #gpaGamesSelectedBox .list .item { display: inline; float: left; padding: 10px 20px 10px 10px; margin: 10px 10px -9px 0px; }
#gpaMobile #gpaGamesSelectedBox .list .item:hover { background: #ddd; }
#gpaMobile #gpaGamesSelectedBox .list .item a { float: right; line-height: 20px; text-decoration: none; }
#gpaTabsBox { width: 100%; }
#gpaTabsBoxTabs { width: 100%; margin: 0px; padding: 0px; }
#gpaTabsBoxTabs input[type="radio"], input[type="checkbox"] { display:none; }
#gpaTabsBoxTabs label { padding: 20px; min-width: 50%; min-height:58px; border-radius: 0px; border: 1px solid #ddd; font-size: 14px; color:#919191; font-weight: 500; }
#gpaTabsBoxTabs label.active { color:#fff!important; padding: 20px; min-width: 50%; min-height: 58px; border-radius: 0px; border: 1px solid #ddd; color: #969696; font-weight: 900; background: #ddd; border-bottom: 2px solid #e10817; }
#gpaTabsBox h4 { font-size: 14px; margin-right: 30px; line-height: 26px; }
#gpaOptionsBox { border: 1px solid #ddd; border-radius: 5px;  }
#gpaDesktop .gpaStep3 { width: calc(100% - 420px); margin: 20px 0 0 0; float: left; border-radius: 5px; }
#gpaDesktop .gpaStep2 h4 { display: block; font-size: 14px; }
.gpaStep2 .titleBox { padding: 5px 20px; }

.btn-group-toggle { display: block; width: 100%; padding: 5px 20px; }
.gpaStep2 .btn-group-toggle label { width: calc(50% - 8px); margin: 4px; border: 1px solid #dfdfdf; border-radius: 4px; padding: 12px; text-align: center; background: #fff; color: #333; box-shadow: none; font-weight: bold; font-size: 14px; border-radius:4px; outline: none; }
.gpaStep2 .btn-group-toggle label.active { background: #f8f8f8; border: 1px solid #2acb85; color: #2acb85; border-radius:4px; padding: 12px; outline: none; }

.gpaStep2 .btn-group-toggle label.focus { outline: none; }
.gpaStep2 .btn-group-toggle label:hover { background: #f8f8f8; }
.gpaStep2 .btn-group-toggle label div { font-weight: normal; }
.form-check .form-check-label { user-select: none; margin: 0; font-size: 14px; }
.form-check .form-check-label:hover { background: #f8f8f8; }
.form-check .form-check-label .info { float: right; line-height: 24px; padding: 0 10px 0 10px; }
.form-check .form-check-label .price { float: right;  line-height: 24px; }
.form-check input[type="checkbox"] { display: none; }
.form-check input[type="checkbox"] + .form-check-label { display: block; cursor: pointer; padding: 0 0 0 10px; font-weight: normal; border-top: 1px solid #ddd;  border-left: 3px solid #fff; line-height: 24px; padding: 5px; }
.form-check input[type="checkbox"] + .form-check-label:before { content: "\2713"; color: #d6d6d6; padding-right: 5px; }
.form-check input[type="checkbox"]:checked + .form-check-label { border-left: 3px solid #e10918; }
.form-check input[type="checkbox"]:checked + .form-check-label:before { color: #41a245; font-weight: bold; }
.form-radio .form-radio-label { background: #111; position: relative; user-select: none; margin: 0; font-size: 14px; overflow: hidden; transition: all ease-in-out 100ms; border-left: 3px solid #111!important; }
.form-radio .form-radio-label:hover { border: 1px solid #151515; background: #0e0e0e; transition: all ease-in-out 100ms; border-left: 3px solid #0090e2!important; text-decoration: none; }
.form-radio .form-radio-label .info { float: right; line-height: 24px; padding: 0 0 0 10px; font-size: 18px; color:#d6d6d6; background: inherit; text-decoration: none; }
.form-radio .form-radio-label .info:hover { color:#333333; text-decoration: none; }
.form-radio .form-radio-label .price { position: absolute; background: inherit; right: 30px; float: right; line-height: 24px; padding: 0 5px; }
.form-radio input[type="radio"] { display: none; }
.form-radio input[type="radio"] + .form-radio-label { display: block; cursor: pointer; padding: 0 0 0 10px; font-weight: normal; border: 1px solid #ddd; line-height: 24px; padding: 8px; margin-top: -1px; }
.form-radio input[type="radio"] + .form-radio-label:before { padding-left: 5px; }
.form-radio input[type="radio"]:checked + .form-radio-label { border-left: 3px solid #e10918!important; background: #111; }
.form-radio input[type="radio"]:checked + .form-radio-label:before { color: #41a245; font-weight: bold; }
.form-radio.disabled .form-radio-label { background: #eee; }
.form-radio.disabled input[type="radio"] + .form-radio-label:before { color: #eee; }
#gpaMobile .form-radio .form-radio-label .info { line-height: 30px; }
#gpaMobile .form-radio .form-radio-label .price { line-height: 30px; } 
#gpaMobile .form-radio input[type="radio"] + .form-radio-label { line-height: 30px; }
#gpaAdviceBox { border: 1px solid #ddd; border-radius: 5px; }
#gpaAdviceBox #gpaDefinitionRadio { /*border-bottom: 1px solid #dfdfdf;*/ }
#gpaAdviceBox #gpaDefinitionRadio .info { float: left; width: 50%; font-size: 14px; line-height: 16px; margin: 0px 0px 10px 0px; }
#gpaAdviceBox #gpaDefinitionRadio .buttons { float: right; margin-top: -25px; }
#gpaAdviceBox #gpaDefinitionRadio .buttons input[type="radio"], input[type="checkbox"] { display:none; }
#gpaAdviceBox #gpaDefinitionRadio .buttons label { background-color:#111; margin: 0px; margin-left: -4px; padding: 10px; min-width: 150px; min-height: 40px; border-radius: 0px; border: 1px solid #ddd; font-size: 14px; line-height: 20px; color: #969696; text-decoration: none; border-right: 1px solid #ddd; }
#gpaAdviceBox #gpaDefinitionRadio .buttons label.active { background: #ddd; border-bottom: 2px solid #e10817; border-radius:0px; color: #fff; }
#gpaAdviceBox .list { list-style-type: none; padding: 0; margin: 0; }
#gpaAdviceBox .list .item { display: block; list-style-type: none; margin: 10px; padding: 10px; float: left; border: 1px solid #ddd; border-radius: 5px; opacity: 0.6; }
#gpaAdviceBox .list .image { height: 100%; }
#gpaAdviceBox .list .caseImage { position: absolute; top: 20px; bottom: 0; left: 0; height: calc(100% - 20px); }
#gpaAdviceBox .list .monitorImage { position: absolute; top: 0; bottom: 0; right: 0; height: 100%; }
#gpaAdviceBox .list .imageBox { background: #111; width: 100%; text-align: center; padding: 30px; margin-bottom: 10px; }
#gpaAdviceBox .list .imageBox .inner { position: relative; height: 188px; width: 100%; }
#gpaAdviceBox .list .item:hover, #gpaAdviceBox .list .item.selected { background: #111; box-shadow: 0 0 8px rgba(0,0,0,0.1); opacity: 1; }
#gpaAdviceBox .list .item.selected h2 { font-size: 19px; font-weight: 900; }
#gpaAdviceBox .list .item header h4 { font-weight: bold; font-size: 24px; }
#gpaAdviceBox header p { font-size: 21px; font-weight: 700; }
#gpaAdviceBox header p .price { display: block; text-align: center; width: 100px; background: #111; float: right; font-style: normal; font-size: 17px; border-radius: 3px; font-weight: 700; padding: 6px; }
#gpaAdviceBox .inCartButton { margin-top: 60px; display: block; text-align: center; width: 100% !important; padding: 15px; font-size: 14px; }
#gpaAdviceBox .shareButton { float: left; }
#gpaAdviceBox .scoreLink { float: right; color:#fff;  border: 1px solid #ddd; border-radius: 25px; width: 58%; margin: 0px 0px 10px 0px; }
#gpaAdviceBox .scoreLink .score { float: left; font-size: 23px; color: #29cb85; margin: 12px 0px 10px 20px; font-weight: bold; }
#gpaAdviceBox .scoreLink .rating-box { float: right; margin: 10px; }
#gpaAdviceBox .scoreLink .scoreCount { float: right; margin-right: 23%; font-size: 12px; color: #fff; line-height: 30px; }
#gpaAdviceBox .shareButton { color:#fff; font-size: 17px; display: block; text-align: center; width: 30px; height: 30px; line-height: 31px; transition: all 200ms; float:left; }
#gpaAdviceBox .shareButton:hover { text-decoration: none; color:#333333; box-shadow: 0 0px 4px 0 rgba(0, 0, 0, 0.05), 0 6px 10px 0 rgba(0, 0, 0, 0.05); transition: all 200ms; }
#gpaAdviceBox .components { list-style-type: none; padding: 0; margin: 10px; }
#gpaAdviceBox .components li { padding: 0px; margin: -3px; font-size: 14px; width: 100%; overflow: hidden; display: inline-block; text-overflow: ellipsis; white-space: nowrap; border: 1px solid transparent; }
#gpaAdviceBox .components li:hover { color:#c1c1c1; }
#gpaAdviceBox .assamblyLink { display: block; text-align: center; padding: 10px; text-decoration: underline; }
#gpaAdviceBox .assamblyLink:hover { color:#333333; text-decoration: underline; }
#gpaAdviceBox .selectedAdvice { color:#fff; text-align: center; border: 1px solid #1cf98b; margin: 10px 0 10px 0; padding: 5px; border-radius: 25px; }
#gpaAdviceBox h4 { font-size: 20px; font-weight: 700; margin-left: 5px; margin-top: 25px; }
#gpaNextStep2 { float: right; }
#gpaDesktop #gpaGamesBox { min-height: 300px; }
#gpaAdviceBox .list .item.col50 { width: calc(50% - 20px); }
#gpaAdviceBox .list .item.col100 { width: calc(100% - 20px); }
.gameScore { position: absolute; left: 10px; bottom: 16px; padding: 1px 1px; width: 50%; height: 14px; }
.gameScore .score { background: #ddd; width: 13px; height: 11px; margin: 1px; float: left; border-radius: 5px; }
.gameScore .score.on { background: #f60; }

#gpaAssembly .infoHeader {  padding: 10px; }
#gpaAssembly .imageBox { float: right; width: 80px; height: 60px; padding: 2px; overflow: hidden; }
#gpaAssembly .imageBox .inner { position: relative; height: 100%; }
#gpaAssembly .imageBox .image { height: 100%; }
#gpaAssembly .imageBox .caseImage { position: absolute; top: 5px; bottom: 0; left: 0; height: calc(100% - 5px); }
#gpaAssembly .imageBox .monitorImage { position: absolute; top: 0; bottom: 0; right: 0; height: 100%; }
#gpaAssembly .text { padding: 10px 0; height: 60px; }
#gpaDesktop #gpaAssembly .list { height: 500px; overflow-y: scroll; border: 1px solid #ddd; border-radius: 5px; scrollbar-color: rgba(86, 86, 86, 1) #ddd; }
#gpaMobile #gpaAssembly .list { }
#gpaAssembly .list .category { margin-top: 0px; }
#gpaAssembly .list h5 { margin: 0; font-weight: bold; padding: 17px 0px 0px 45px; background: url(/game_computer_store/img/hardwaresprite-hover.png) no-repeat; color: #fff; height: 50px; }
#gpaPageBullits { text-align: center; }
#gpaPageBullits i { margin: 5px; }
#gpaPageBullits i:before { font-size: 17px; color: #808080; }

.gpaStep1, .gpaStep2, .gpaStep3, .gpaStep4 { display: none; }
.upsBoxhead { padding: 5px 0px 23px 0px; border-bottom: 1px solid #ddd; width: 100%; overflow: hidden; }
.upsBoxhead ul { margin: 0px -30px 0px 0px; list-style: none; overflow: hidden; padding: 0; }
.upsBoxhead li { position: relative; padding: 0px 30px 0px 20px; float: left; font-family: 'Open Sans', sans-serif; font-size: 14px; color: #fff; line-height: 22px; }
.upsBoxhead li:before { position: absolute; left: 1px; font-family: 'FontAwesome'; content: "\f058"; font-size: 18px; color: #19a4ff; }
.upsBoxhead li a { color: #333333; text-decoration: none; }
.upsBoxhead li a:hover { text-decoration: underline; }
.upsBoxhead.benifitfooter { background: #fff; margin-bottom: 0px; }
.upsBoxhead.benifitfooter li:before { position: absolute; left: 0px; top: -3px; font-family: 'FontAwesome'; content: "\f00c"; font-size: 18px; color: #111; }
.upsBoxhead.noborder { border: none; }
.gpaTopBar { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 100px; background: #000; z-index: 500; overflow: hidden; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.1); }
.gpaTopBar .inner { max-width: 1170px; margin: 0 auto; }
.gpaTopBar .inner h3 { font-weight: bold; font-size: 18px; margin-bottom: 0px; margin-top: 20px; }
.gpaTopBar .left { display: block; height: 100px; width: 66%; float: left; }
.gpaTopBar .right { display: block; height: 100px; width: 33%; float: right; }
.gpaTopBar .left ul { list-style: none; margin: 0; padding: 0; }
.gpaTopBar .left ul li { float: left; padding: 0 14px 0 25px;  margin: 0; }
.gpaTooltip { position: fixed; padding: 15px; margin: 1em 0 3em; color: #000; background: #fff; border-radius: 10px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 8px; width: 250px; z-index: 5; }
.gpaTooltip:after {  content: ""; display: block; position: absolute; top: -15px; left: 20px; width: 0; border-width: 0px 15px 15px 15px; border-style: solid; border-color: transparent transparent #fff transparent; }
.ui-helper-hidden-accessible { display: none; }
.assembly-phone-top { margin-top:25px; padding:10px; }
.assembly-phone-top a { color: #fff; font-weight:400; }
.assembly-phone-top i { color:black; margin-right:5px; }
.assembly-phone-top a, .assembly-phone-top i { font-size:16px; }