/***************** defaults *********************/



/***************** variables *********************/





@font-face { font-family: ""; src: url(''); }


:root {--font1:"Roboto", sans-serif; --font2:"Roboto", sans-serif; --font3:"Arapey", cursive;}


/***************** html-body *******************/


html:has(body.modal-open) {overflow-y:hidden;}
html {scroll-behavior: smooth !important; word-wrap:break-word;  overflow-wrap: anywhere;overflow-x:hidden;}
body {font-family: "Roboto", sans-serif; font-weight:300; letter-spacing:1px; line-height: 2; background:url("") 50% 50% / cover no-repeat fixed #ffffff; color: #17141b; overflow-x:unset;} 
html, body {font-size: 25px;} 

:has(body.dark) ::-webkit-scrollbar-thumb {background: #2e2e2e !important;}
body.dark {background-color:#0B0D11; color:#ffffff;  transition:.3s all;}
body.dark .btn:not(.btn-light) {color:#ffffff !important;}
body.dark .hero:is(.bg-slider, .bg-video).bg-fixed ~ .block-section:not([class*='bg-']), body.dark .div-bot + div:after {background-color:#0B0D11;}
body.dark a {color:#ffffff;}
/*body.dark .modal .modal-content {background-color:#0B0D11 !important; color:#ffffff;}*/
body.dark .block-list :is(.modal-list .list-group-item, .accordion .card-header) > h5 > .btn {background-color:#17141b !important; border-color:rgba(255,255,255,0.3) !important;}
body.dark .block-list-group.accordion .card .card-header h5 .btn, body.dark .block-list ~ .block-button .btn:not(.btn-light) {color:#ffffff !important; background:#17141b !important; border-color:#ffffff;}
body.dark .block-list-group.accordion .card .card-body {border-color:#2e2e2e !important; background:linear-gradient(to bottom,#17141b,transparent) !important;}
body.dark .news.block-list-group .list-group-item {border:none !important;}
body.dark .news.block-list-group .list-group-item:not(:has(.list-content > p:first-child img))::before {background-color:#0B0D11;}
body.dark .news.block-list-group .list-group-item:not(:has(.list-content > p:first-child img)) {background-image:url("https://www.ronimedical.se/files/icons/icon_wh.svg") !important;}
body.dark .block-list-group.tabs .nav-tabs .nav-item {background-color:transparent;}
body.dark .block-list-group.tabs .nav-tabs .nav-item .nav-link {background-color:#17141b; color:#ffffff;}
body.dark .page-cover .breadcrumbs a {color:#a6a6a6;}
body.dark .bg-video.bg-fixed ~ .block-section:not([class*='bg-']) {background-color:#0B0D11;}
body.dark .modal-content {background-color:#0B0D11 !important;}
body.dark .modal-content .modal-footer .btn {color:#17141b !important;}
body.dark .modal-list.block-list-group .list-group-item .modal .modal-header .close {color:#ffffff;}
body.dark .block-form .form-3 .form-group > label {background-color:#0B0D11;}
body.dark .block-form .form-control {background-color:#17141b; color:#ffffff; border-color:#ffe600;}
body.dark .block-form .form-control:is(:active, :focus) {border-color:#ffffff;}
body.dark .sub:not([class*='text-']) .__content {color:#ffffff;}
body.dark iframe[src*="google.com/maps"] {filter:saturate(0) invert(.9);}
body.dark .contact-card .block-columns .__col .block-section {background-color:#17141b !important;}
body.dark .contact-card .block-columns .__col .block-section:before {background:linear-gradient(to bottom, rgba(0,0,0,0.8) 10rem, transparent 0) !important;}
body.dark .table :is(th, td) {border-color:#ffffff;}
body.dark .bg-custom7 .table :is(th, td) {border-color:#bae2fd;}
body.dark .news.block-list-group .list-group-item {background-color:#17141b; color:#ffffff; border-color:#4f4f4f !important;}
body.dark .news.block-list-group .list-group-item:not(:has(.list-content > p:first-child img)), body.dark .block-list:not(.testimonials) .news.block-list-group .list-group-item:not(:has(.list-content > p:first-child img)):before {background-color:#17141b !important;}
body.dark .fb-frame a {background-color:#0B0D11 !important;}
body.dark .fb-frame a:before {filter:contrast(0) brightness(3);}
body.dark .price table td:nth-child(2) {color:#ffffff !important; }
body.dark .lang {background-color:rgba(0,0,0,0.3); box-shadow:rgba(0,0,0,0.8) 0px 0px 2000px inset;}

.text-dark, .text-dark p, .text-dark h1, .text-dark h2, .text-dark h3, .text-dark h4, .text-dark h5, .text-dark h6, .text-dark a:not(.btn), .text-dark a:not(.btn):hover {color: #17141b !important;}

/***************** paragraphs *******************/

h1, h2, h3, h4, h5, h6 {font-family:"Roboto", sans-serif; font-weight:500; margin:0; padding:0; color: inherit; letter-spacing:.8px; line-height:1.5;}
h1 {font-size: calc(4rem + 0px); line-height:calc(4rem + 1rem);}
h2 {font-size: calc(3rem + 0px); line-height:calc(3rem + 1rem);}
h3 {font-size: calc(2.5rem + 0px); line-height:calc(2.5rem + 1rem);}
h4 {font-size: calc(2rem + 0px); line-height:calc(2rem + 1rem);}
h5 {font-size: 1.5rem; font-weight:300; font-family:"Roboto", sans-serif; line-height:calc(1.5rem + 1rem);}
h6 {font-size: .8rem; letter-spacing: 3px; text-transform: uppercase; font-family:"Roboto", sans-serif; line-height:calc(calc(.8rem + 1rem) / 1.2);}
p, a, ul, ol, li {margin: 0; margin-bottom:0; padding: 0; font-family:inherit;}
b, strong {font-weight:800;}
h1 strong {font-size:5.5rem;}
p > strong > em {font-weight:normal;  font-size:.8rem; line-height:normal; display:block;}
s {text-decoration: none !important; color:#0671b7 !important;}
:is(i,em):is(.fa,.fab,.fas) {font-style:normal;}

main a, main a * {transition:.3s all; text-decoration:none; border:none;} 
main a {color:inherit; transition: .3s all; border-bottom:1px dashed; text-decoration:none !important; cursor:pointer;}
main a:hover {color:#0671b7;}
small {display:inline-block;}
main .no a {border:none !important;}

::selection, ::-moz-selection {color: #ffffff; background: #0671b7;}
.bg-primary *::selection, .bg-primary *::-moz-selection {background: #ffe600;}

hr {width: 100%; margin: 1rem auto auto auto; min-height: 1px; background-color: #0671b7; border-color: #0671b7;}

.font1, .font1 :is(h1, h2, h3, h4, h5, h6, p) { font-family:"Roboto", sans-serif !important; }
.font2, .font2 :is(h1, h2, h3, h4, h5, h6, p) { font-family:"Roboto", sans-serif !important; }
.font3, .font3 :is(h1, h2, h3, h4, h5, h6, p) { font-family:"Arapey", cursive !important;}
.font4, .font4 :is(h1, h2, h3, h4, h5, h6, p) { font-family:"", system-ui !important;}

/***************** buttons-v1 *********************/

.block-buttons a, .btn {text-align:left; font-weight:500; border:1px solid transparent; font-size:1rem; text-transform:uppercase; letter-spacing:1px; color:#ffffff; margin-top:2rem; padding:.8rem 1.5rem; height:auto; min-height:2rem; display:inline-flex; align-items: center; border-radius:30px; justify-content: space-between; transition:.3s all;}
.block-buttons a:is(:hover,:focus,:focus-visible,:active), .btn:is(:hover, :focus, :focus-visible, :active) {opacity:.7; outline:none; box-shadow:none !important; text-decoration:none !important; border-color:transparent;}
.block-buttons a:after, .btn:not(.btn-info):after {content:"\f101"; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; margin-left:1rem; transition:.3s all;}
.block-buttons a:active, .btn:not(.btn-info):active {background-color:#17141b !important; color:#ffffff !important; border-color:#17141b !important;}
.block-buttons a, .btn.btn-primary {background-color:#0671b7;}
.btn.btn-secondary {background-color:#ffe600; color: #0671b7;}
.btn.btn-success {background-color:#32a852;}
.btn.btn-danger {background-color:#77220B;}
.btn.btn-warning {background-color:#FFDA16; color:#17141b;}
.btn.btn-light {background-color:#ffffff; color:#17141b !important; border:none !important;}
.btn.btn-light:hover {background-color:#d9d9d9;}
.btn.btn-dark {background-color:#17141b;}
.btn.btn-default {background-color:#e8e8e8; color:#17141b;}
.btn-link {border:none !important; text-decoration:none !important;}
.block-button .__content:has(.btn:is(.ml-md-auto,.ml-auto)) {display:flex;}
.btn.btn-custom {border:1px solid #17141b; color:#17141b;}
:is(body.dark, .bg-dark) .btn.btn-custom, .btn.btn-custom.text-light {border:1px solid #ffffff; color:#ffffff;}

.btn.btn-info {background-color:transparent !important; color:#17141b !important; border:none !important; padding:0; border-radius:0; font-weight:500; letter-spacing:1px;}
.btn.btn-info.text-light {color:#ffffff !important;}
.btn.btn-info:is(:hover, :active, :focus, :focus-visible) {color:#0671b7 !important;}
.btn.btn-info:after {content:"\f061"; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; color:inherit; margin-left:1rem; transition:.3s all;}
.btn.btn-info:hover:after {margin-left:1.5rem;}

.btn.btn-info.btn-back {flex-direction: row-reverse;}
.btn.btn-info.btn-back:after {margin-left: 0; margin-right: 1rem; transform: scale(-1);}
.btn.btn-info.btn-back:hover:after {margin-right: 2rem;}

.block-buttons.btn-sm a, .btn.btn-sm {font-size:.8rem; min-height:auto !important;}
.block-buttons.btn-lg a, .btn.btn-lg {width:100%; line-height:1.5; font-size:1rem; min-height:auto !important;}
.block-button ~ .block-button .btn {margin-top:1rem;}
.block-list ~ .block-button .btn {margin-top:1rem; width:100%;}

.block-button a:before {display:none;}

/***************** utilities *********************/

.card {background-color:transparent; border:none;}

/***************** main *********************/

:root {--contwidth:1840px;}
.container, .block-section > .block-section-container {max-width: var(--contwidth);}
.container {padding: 0;}
.container-fluid {padding: 0;}
main > .block-section {padding: 6rem 0;}
main .block-section {position:relative;}
main .block-section div:is(.block-section-container, .block-columns) {height:100%;}
.block-columns .__col .__content {padding-left:0; padding-right:0;}

main ol {margin-left:1rem !important;}
main ul {list-style:none;}
main ul li:before {content: "\f0da"; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; padding: 0 10px 0 0; color: inherit;}
/*main ul li:before {content: ""; margin-right:.5rem;  background-image:url("https://www.ronimedical.se/assets/images/favicon.svg"); background-position:center; background-size:contain; background-repeat:no-repeat; background-position:left; padding:0 .65rem !important;}*/
main ul li ul {margin-top:0; margin-left:1rem; font-size: smaller; padding-bottom:.3rem !important;}
main ul li ul li {line-height:2;}
main ul li ul li:before {content: "•"; background:none !important; margin-right:0;}
main :is(.block-text, .block-list) ul {margin-top:0;}
ul li.tel:before {content:"\f879";}
ul li.mail:before {content:"\f0e0";}
ul li.map:before {content:"\f3c5";}

.bg-image {background-position: center center; background-size: cover !important; background-repeat:no-repeat;}
.bg-fixed {background-attachment: fixed;}
.bg-contain {background-size: contain !important;}
.bg-contain-40 {background-size: 40% !important;}
.bg-contain-50vw {background-size: 50vw !important;}
.bg-contain-50vh {background-size: 50vh !important;}
.bg-tile {background-size:20rem !important; background-repeat:repeat; }
.bg-tile-x {background-size:15rem !important; background-repeat:repeat-x; }
.bg-tile-y {background-size:15rem !important; background-repeat:repeat-y; }

/*************blocks fullwidth***************/

.block-section.xs-box .block-columns .block-section {padding: 1rem;}
.block-section.xsm-box .block-columns .block-section {padding: 1.5rem;}
.block-section.sm-box .block-columns .block-section {padding: 2rem;}
.block-section.md-box .block-columns .block-section {padding: 2.8rem;}
.block-section.lg-box .block-columns .block-section {padding: 3.5rem;}
.block-section.xl-box .block-columns .block-section {padding: 4.5rem 3.5rem;}
.block-section.xs-inline-box  .block-columns .block-section {padding-inline: 1rem;}
.block-section.xsm-inline-box  .block-columns .block-section {padding-inline: 1.5rem;}
.block-section.sm-inline-box  .block-columns .block-section {padding-inline: 2rem;}
.block-section.md-inline-box .block-columns .block-section {padding-inline: 2.8rem;}
.block-section.lg-inline-box .block-columns .block-section {padding-inline: 3.5rem;}
.block-section.xl-inline-box .block-columns .block-section {padding-inline: 3.5rem;}


.block-section > .block-section-container > .block:not(.sub):first-child > .__content > :first-child {margin-top:0;}

/****************** form ******************/

.block-form {margin-top: 0 !important;}
.block-form .form-control {border: none; background: #fff; transition:.3s all; border-left: 4px solid #d9d9d9; color: #17141b; padding: 15px;  border-radius: 30px; height: auto; -webkit-appearance: none; -moz-appearance: none; appearance: none; moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;}
.block-form .form-control:focus {background: #e8e8e8; border-left: 4px solid #17141b; color: #17141b;}
.block-form .form-control::-webkit-input-placeholder, .block-form .form-control:-moz-placeholder, .block-form .form-control::-moz-placeholder, .block-form .form-control:-ms-input-placeholder {color: #17141b;}
.block-form .form-control option {color:#17141b !important;}
.block-form .btn-primary {margin-top: 0;}
.block-form textarea.form-control {height:100px;}
.block-form .input-group-addon {border-radius: 0; padding: 15px; font-size: .75rem; line-height: 1.5; background-color: #a6a6a6; color: #4f4f4f; border: none;}
.block-form .form-fields .radio {text-align:justify;}
.checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"], .radio input[type="radio"], .radio-inline input[type="radio"] {margin-right: 10px !important;}
.block-form .form-footer a.btn-policy {display: block; border-bottom: 2px dotted; text-transform: uppercase; letter-spacing: 2px; font-size: .8rem; margin-bottom: 1rem; text-align: right; width: fit-content; margin-left: auto;}

.block-form .form-1 .form-control {background: #0671b7; border: none; border-radius: calc(30px / 3); color: #ffffff;}
.block-form .form-1.light .form-control {background: #ffffff; color: #17141b;}
.block-form .form-1 .form-fields.row div {padding:1px; margin:0;}
.block-form .form-1 .form-fields.row {padding-inline:13px !important;}
.block-form .form-1 .form-captcha label {margin-block:.5rem 0 !important;}
.block-form .form-1 .form-footer .btn {width: 100%; border-radius: calc(30px / 3); background: transparent !important;}
.block-form .form-1.form-btn-dark .form-footer .btn {color:#17141b !important; border-color:#17141b !important;}
.block-form .form-1.form-btn-light .form-footer .btn {color:#ffffff !important; border-color:#ffffff !important;}
.block-form .form-1.light .form-footer :is(.btn, .btn:hover) {color:#ffffff !important;}
.block-form .form-2 .form-control {background: transparent; border-left: none !important; border-bottom: 1px solid rgba(0,0,0,0.5); border-radius: 0; color: inherit;}
.block-form .form-2 :is(.form-fields.row, .form-captcha) label {    margin-left: 0.7rem;}

.block-form .radio-col.form-group {gap:1rem; display: flex; align-items: flex-end; height: 100%; flex-direction: row; justify-content: space-evenly;}
.block-form .radio-col.form-group .radio label {display: flex; flex-direction: column-reverse; width: 2rem; align-items: center; margin:0 !important; padding-bottom:.8rem;}
.block-form .radio-col.form-group .radio label input {margin:0 !important; height: 1.5rem; width: 1.5rem; accent-color: #0671b7; }

.text-light .block-form .form-control:is(.form-1,.form-2), .block-form .text-light .form-control:is(.form-1,.form-2) {border-color:#ffffff; color:#ffffff;}

.text-light .form-2 .form-control::placeholder {color: #ffffff !important;}
.text-light .form-2 .form-control::-webkit-input-placeholder {color: #ffffff !important;}
.text-light .form-2 .form-control::-ms-input-placeholder {color: #ffffff !important;}
.text-light .form-2 .form-control::-moz-placeholder {color: #ffffff !important;}

.block-form .text-light .form-footer .btn {color:#ffffff !important;}
.block-form .span-light :is(label, span) {color:#ffffff !important;}

.block-form form:not(.form-3) .form-group:has(> label + input[type='file']) {height: 100%; display: flex; flex-direction: column; justify-content: flex-end; margin-top: -0.5rem;}
.block-form form:not(.form-3) .form-group:has(input[type='file']) > label {font-size:.7rem; line-height:normal; padding-inline:.5rem; margin-bottom:.25rem;}

:is(.bg-primary, .form-light) .block-form .form-control {transition:0s !important; color:#17141b !important;}
:is(.bg-primary, .form-light) .block-form .form-control, .bg-secondary .block-form form:not(.form-2) .form-control {background: #ffffff;}
:is(.bg-primary, .form-light) .block-form .form-control:focus {border-left: 4px solid #7a7a7a;}
.bg-secondary .block-form .form-control:focus {border-left: 4px solid #0671b7;}
:is(.bg-primary .form-light, .form-light) .btn:hover, .bg-secondary .btn:hover {color:#ffffff !important;}
/*.bg-primary .block-form .form-footer .btn {background-color:#32a852 !important; }*/

.block-form .form-3 .form-group > label {position:relative; z-index:2; background-color:#ffffff; padding-inline:0 .5rem !important;}
.block-form .form-3 .form-group > label small {line-height:normal;}
.block-form .form-3 .form-group .form-control {background: transparent; border: 1px solid #7a7a7a !important; border-radius: 0; color: inherit; padding-top:1.5rem !important; margin-top:-1rem !important;}
.block-form .form-3 .form-group .input-group {z-index:1;}
.block-form .form-3 .form-group .input-group [data-toggle=datetimepicker] > .input-group-text {border-color:#7a7a7a !important;}
.block-form .form-3 .form-group:has(.checkbox,.radio) {border: 1px solid #7a7a7a; margin-top: 1.5rem; padding-block: 1.25rem .25rem; padding-inline: .5rem;}
.block-form .form-3 .form-group:has(.checkbox,.radio) > label {top: .5rem !important; left: 0; margin-left:6px; padding-right: .5rem; position: absolute; display: inline-block; background: #E8E8E8;}
.block-form .form-3 .form-group :is(.checkbox,.radio) input {min-width: 1.3rem; height: 1.3rem; margin-right:.6rem !important; margin-top:.05rem;}
.block-form .form-3 .form-group :is(.checkbox,.radio) > label {display: flex; align-items: flex-start; line-height:1.5; padding-block:.25rem; text-align:left;}
.block-form .form-3 .form-group:has(.checkbox,.radio):not(:has(>label)) {margin-top: 0; padding-block: .25rem;}
.block-form .form-3 .form-group:not(:has(>label)) .form-control {margin-top: 0 !important; padding-block: .75rem !important; }

.block-form form:has(.btn[type='submit'][disabled]):after {content: ""; background: url("../../assets/images/loader.gif") 50% 50% / 5rem no-repeat scroll transparent; position: absolute; inset: 0;}
.block-form form:has(.btn[type='submit'][disabled]) { cursor: wait; opacity: .5; }
.block-form form:has(.btn[type='submit'][disabled]) :is(input,textarea,select,.btn[type='submit']) {pointer-events:none;}


.form-fields.row { padding-left: 8px; padding-right: 8px;}
.form-select:before {content: "\f0d7"; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; position: absolute; z-index: 10; right: 25px; top: 5px;}
.form-select:has(label):before {top: 2.25rem;}
.form-fields.row > div {padding-right:7px; padding-left:7px;}
main.full-width-all .form-fields.row {margin-inline:-7px !important;}
.form-fields.row label {margin-bottom:0;}
.form-btn-light .btn {color:#ffffff !important;}


.bootstrap-datetimepicker-widget {width:100% !important;}
.bootstrap-datetimepicker-widget > ul li {margin:0; padding:0;}
.bootstrap-datetimepicker-widget > ul li:before {display:none !important;}
.bootstrap-datetimepicker-widget > .row {flex-direction: column-reverse;}
.bootstrap-datetimepicker-widget .datepicker table thead {background-color:#17141b; font-size:1rem;}
.bootstrap-datetimepicker-widget .datepicker table thead tr:nth-child(2) {font-size:.8rem;}
.bootstrap-datetimepicker-widget .datepicker table thead tr:nth-child(2) th {border-radius:0 !important;}
.bootstrap-datetimepicker-widget .datepicker table tbody {font-size:.8rem;}
.bootstrap-datetimepicker-widget .datepicker .datepicker-days table td:is(.active,:hover),
.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th:hover,
.bootstrap-datetimepicker-widget .datepicker table td span.active {background-color:#0671b7 !important;}
.bootstrap-datetimepicker-widget .datepicker .datepicker-decades .decade {line-height:unset;}
.bootstrap-datetimepicker-widget .timepicker {flex: 1; max-width: fit-content; margin-inline: 15px;}
.bootstrap-datetimepicker-widget .timepicker .timepicker-picker {}
.bootstrap-datetimepicker-widget .timepicker table {}
.bootstrap-datetimepicker-widget .timepicker table td {height: unset !important; line-height: 1; padding: 0;}
.bootstrap-datetimepicker-widget .timepicker table td span {height: auto !important; line-height: 1.5; font-size: .9rem;}
.bootstrap-datetimepicker-widget .timepicker table td span:is(:hover,:active,:focus-within,:visited,:focus) {background-color:#e8e8e8 !important;}
.bootstrap-datetimepicker-widget .timepicker .timepicker-picker a.btn {color:#0671b7; padding:0;}
.bootstrap-datetimepicker-widget .timepicker .timepicker-picker a.btn:is(:hover,:active,:focus-within,:visited,:focus) {background-color:transparent !important; border:none !important;}
 
 
div:is(.js-load, .full-width-all) .form-fields.row {padding-left: 0px; padding-right: 0px; margin-left: -7px; margin-right: -7px;}

/***************** styling *********************/
main p {margin: 1rem 0 0 0;}
main h1, main h2, main h3, main h4, main h5, main h6 {margin: 23px 0 0 0;}

main :is(ul, ol) {margin: 15px 0 0 0;}
main :is(ul, ol) li {margin: 4px 0;}
main :is(ul, ol) li:before {padding: 0 8px 0 0;}

main > #section-404 {height:100vh;}
main > #section-404 > .block-section-container {display: flex; align-items: center; justify-content: center; align-content: center; text-align:center;}
main > #section-404 .block-error-404 {font-size:3rem; position:relative; line-height:normal; margin-top:8rem;}
main > #section-404 .block-error-404:before {content:""; position:absolute; left:50%; transform:translateX(-50%) translateY(-8rem); height:8rem; width:90%; background:url("../../assets/images/icons/404.gif") 50% 50% / contain no-repeat scroll;}
main:has(#section-404) ~ footer .ftr-banner {display:none;}
body:not(.dark):has(#section-404) .navbar:not(.scrolled) .nav-inner .navbar-nav > .nav-item > .nav-link {color:#17141b;}

/************************COOKIES-v3*******************************/

body.modal-open.no-cookie #modal-cc {display:none !important;}
html:has(body.modal-open.no-cookie #modal-cc.d-none), body.modal-open.no-cookie:has(#modal-cc.d-none) {padding-right:0 !important; overflow-y:auto;}

.modal {background: rgba(0,0,0,0.8); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);}
.modal .modal-header .close {order:2;}

#modal-cc {font-size:18px;}
#modal-cc .modal-dialog {position:fixed; inset: auto auto 2em 2em; margin: 2em 2em 0 0; max-width:50em;}
#modal-cc .modal-content {background-color:#ffffff; color:#17141b; border-radius:calc(30px/2); padding:3em;}
#modal-cc .modal-content * {color:inherit;}
#modal-cc .modal-header {margin-bottom:1.5em; border:none; padding:0; display: flex; align-items: center;}
#modal-cc .modal-header .close {display: flex; align-items: center; justify-content: center; right:3em; top:3em; opacity:1; background-color:transparent; border:1px solid #17141b !important; color:inherit; font-size:0; letter-spacing:0; line-height:0; width: 3em; height: 3em; border-radius: 50%;}
#modal-cc .modal-header .close:before {content:"\f00d"; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; font-size:12px;}
#modal-cc .modal-header .modal-title {font-size:1.2em;}
#modal-cc .modal-body {background-color:transparent; padding:0;}
#modal-cc .modal-content .nav-pills {gap:1em; }
#modal-cc .modal-content .nav-pills .nav-link:hover {opacity:1;}
#modal-cc .modal-content .nav-pills .nav-link {color:inherit; text-transform: uppercase; letter-spacing: 2px; transition:.3s all; opacity:.5; text-align: left; background: transparent; border-bottom: solid 1px rgba(0,0,0,0.2); border-radius: 0; padding-inline: 2.5px; font-size:.9em;}
#modal-cc .modal-content .nav-pills .nav-link.active {opacity:1;}
#modal-cc .modal-body p {font-size:.8em;}
#modal-cc .modal-body p + p {margin-top:1em;}
#modal-cc .modal-body hr {display:none;}
#modal-cc .modal-body .tab-pane {max-height:60vh;}
#modal-cc .modal-body .tab-pane a {color:inherit; border-bottom:1px dashed;}
#modal-cc .modal-body .tab-pane h5 {font-size:1.1em; margin-bottom:.5em;}
#modal-cc #cc-buttons {display: flex; justify-content: center; gap:.5em; margin-inline:-2px; padding-top:.5em;}
#modal-cc #cc-buttons .btn {margin:0 !important; background:transparent !important; font-size:.8em; display: flex; justify-content: center; border:1px solid #17141b; color:#17141b !important; border-radius:30px;}
#modal-cc #cc-buttons .btn:after {display:none !important; color:inherit !important;}
#cc-settings-container i {font-style: normal;}
#cc-settings-container a {color:#0671b7; border:none !important; text-decoration:none !important;}
#cc-settings-container {left:2em; bottom:2em;}

html:has(body.dark) #modal-cc .modal-content {background-color:#2e2e2e !important; color:#ffffff; }
html:has(body.dark) #modal-cc .modal-header .close {border-color: #ffffff !important; }
html:has(body.dark) #modal-cc .modal-content :is(.nav-pills .nav-link, #cc-buttons .btn) {border-color: rgba(255,255,255,0.2);}
html:has(body.dark) #modal-cc #cc-buttons .btn {color:#ffffff !important;}

@media (max-width:1920px) {
    #modal-cc {font-size:16px;}
} @media (max-width:1280px) {
    #modal-cc {font-size:14px;}
} @media (min-width:768px) {
    #modal-cc .modal-dialog {transform-origin:left bottom; transform:scale(.8);}
} @media (max-width:767px) {
    #modal-cc {font-size:12px;}
    #modal-cc .modal-body .tab-pane {max-height:40vh;}
    #modal-cc #cc-buttons {flex-direction: column-reverse;}
    #cc-settings-container {left:1.5em; bottom:1.5em;}
    #modal-cc .modal-body p {font-size:.9em;}
}


.navbar .ftr-only, footer .hdr-only {display:none !important;}

.head {text-align:center;}
.head, .head2 {margin-top:1.5rem;}
.__col :is(.head, .head2) {margin-top:0rem;}
.head :is(h5,h6), .head2 :is(h5,h6) {margin:0; position:relative; overflow:hidden;}
.head :is(h5,h6):after, .head :is(h5,h6):before, .head2 :is(h5,h6):after {border-color:#0671b7; content: ""; width: 10rem; border-bottom: 1px solid; position: absolute; top: 50%; transform: translateY(-50%); margin-left: 15px;}
.text-light .head :is(h5,h6):after, .text-light .head :is(h5,h6):before, .text-light .head2 :is(h5,h6):after {border-color:#ffffff;}
.head :is(h5,h6):after, .head :is(h5,h6):before {width:5rem;}
.head :is(h5,h6):before {margin-left: calc(-5rem - 18px);}
@media (max-width:767px) { :is(.text-left-center, .text-right-center) .head2 :is(h5,h6):before { border-color:#0671b7; content: ""; width: 5rem; border-bottom: 1px solid; position: absolute; margin-top: 0.5rem; margin-left: calc(-5rem - 18px);} :is(.text-left-center, .text-right-center) .head2 :is(h5,h6):after {width:5rem;} }
.block-section.full-width-all .block-section-container {overflow:unset;}
.__base *:not(.__header, .__section-controls, .__buttons, .carousel-indicators, .carousel-caption, .slider-overlay) {position:relative !important; inset:unset !important;}
.lottie1 {position:absolute; top:-15rem;}

.foot.block-header {text-align:center;} .foot3.block-header {text-align:right;}
:is(.foot, .foot2, .foot3).block-header .__content {padding-bottom:1rem !important;}
:is(.foot, .foot2, .foot3).block-header .__content:before {content:""; background:#0671b7; width: 80px; height: 3px; position: absolute; inset: auto auto 0 50%; transform: translateX(-50%);}
.bg-primary :is(.foot, .foot2, .foot3).block-header .__content:before {background:#ffe600;}
.text-light :is(.foot, .foot2, .foot3).block-header .__content:before {background:#ffffff;}
.foot2.block-header .__content:before {left: 17px !important; transform: none !important;} .__col .foot2.block-header .__content:before {left: 0px !important;}
.foot3.block-header .__content:before {left:auto; right: 17px !important; transform: none !important;} .__col .foot3.block-header .__content:before {right: 0px !important;}

.ul-menu-child {display: flex; flex-direction: column; width: 85%; margin-top:10px;}
.ul-menu-child li:before {display:none;}
.ul-menu-child li {opacity:1; height:100%; margin:0; position:relative; }
.ul-menu-child li.back a {color:#17141b; font-weight:600; font-size:.8rem; letter-spacing:2px; padding-block:.5rem; background-color:#e8e8e8 !important;}
.ul-menu-child li.back a:before {content:"\f060"; font-size:.7rem; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; margin-right:.5rem;}
.ul-menu-child li.back span {display:none; position:absolute; background-color:#e8e8e8; cursor:pointer; inset:3px 0 3px auto; width:25px; border-left:4px solid #ffffff; align-items: center; justify-content: center;  transition:.3s all;}
.ul-menu-child li.back span.open i { transform: rotate(90deg);}
.ul-menu-child li a {transition:.3s all; display:block; border:none; color:#7a7a7a; background:transparent; border-bottom:1px solid #7a7a7a;  font-size:1rem; line-height:1.5; padding: 0.3rem 0.5rem; border-top-right-radius:30px; border-bottom-right-radius:30px;}
.ul-menu-child li a:hover {background-color:#e8e8e8 !important;}
.ul-menu-child li.active a {color:#0B0D11; border-color:#0B0D11; font-weight:600;}
.ul-menu-child li.hide {opacity:0; height:0;}

footer [class*='submenu-'] li a:after {display:none;}


.border-col:is(.right, .right-bottom) .__col:not(:last-child) {border-right-width:1px; border-right-style:solid;}
.border-col:is(.left, .left-bottom) .__col:not(:first-child) {border-left-width:1px; border-left-style:solid;}
.border-all, .border-all .__col > .block-section {border-width:4px; border-style:solid; border-color:inherit;}
.outline-all .__col > .block-section, :is(.block-section, .block-section-container).outline, img.outline {outline:2px solid rgba(255,255,255,0.5); outline-offset:-2rem;}

:root {--logo1h:200px; --logo2h:200px;}
.logo1 > .block-section-container {overflow:unset !important;}
.__base .logo1 .__col .block-image { position: relative; inset: 0;}
.logo1 .__col .block-image { position: absolute; top: calc(calc(var(--logo1h) / 2) * (-1)); right: calc(calc(var(--logo1h) / 2) * (-1)); width: var(--logo1h); z-index:1; padding:1rem;}
.logo1 .__col .block-image * {margin-top:0;}
.logo1 .block-image img { animation: bg-rotate 60s linear infinite;}

.logo2:before {position:absolute; inset:0; content:''; background:linear-gradient(to right, #0671b7 40%, rgba(0,0,0,0.8) 40%); z-index:0;}
.logo2:after {content:""; position:absolute; background-image:url("https://www.ronimedical.se/assets/images/favicon.svg"); background-size:80%; background-color:#ffffff; background-position:center; background-repeat:no-repeat; height:var(--logo2h); width:var(--logo2h); left: calc(40% - calc(var(--logo2h) / 2)); top: calc(calc(var(--logo2h) / 2) * -1);}
.logo2 > .block-section-container {max-width:100%; width:calc(40% - 0rem) !important; padding:0 5rem; margin:0;}


@keyframes popp {50% {transform:scale(.95); opacity:.7;}}
.unmute video { object-fit:cover;}
.unmute video + a.pp.pause {animation:popp 1s linear infinite;}
.unmute video + a.pp { position: absolute; cursor:pointer; color:#ffffff; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius:50%; border:2px solid; width: 150px; height: 150px; z-index: 5; bottom: 5rem; right: 5rem; display: flex; align-items: center; justify-content: center; transition:.3s all;}
.unmute video + a.pp:before {content: "\f04b"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size:90px; transition:.3s all;}
.unmute video + a.pp.play:before {content: "\f04c";}
.unmute video + a.pp:is(:hover, .play) {opacity:.5;}


@media (max-width: 767px) {
    .unmute video {height:75vh;}
    .unmute video + a.pp { width: 100px; height: 100px; right:3rem; bottom:3rem;}
    .unmute video + a.pp:before {font-size:50px;}
}


@keyframes bg-rotate { 50% { transform:rotate(360deg); } }

.__base .block-list.socials .list-group-item .list-content {display:block !important;}
.__base .block-list.socials .block-list-group { flex-direction: column !important;}
.__base .block-list.socials .list-group-item {border-bottom:1px solid #ffffff;}
.block-list.socials .block-list-group {display: flex; flex-direction: row;}
.text-center .block-list.socials .block-list-group {justify-content: center;}
.text-right .block-list.socials .block-list-group {justify-content: flex-end;}
.block-list.socials {margin-left:-5px !important; margin-right:-5px !important; margin-top:.5rem;}
.block-list.socials .list-group-item {border:none; padding:0;}
.block-list.socials .list-group-item .list-content {display:none;}
.block-list.socials .list-group-item a {padding: unset; transition: .3s all; font-size: 1.2rem; background: #0671b7; color: #ffffff; display: flex; height: 50px; width: 50px; margin: 5px; border-radius: calc(30px * 1); align-items: center; justify-content: center; text-decoration: none; border: none;}
.block-list.socials .list-group-item a:hover {background:#17141b;}

.bg-blur { backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); box-shadow: rgba(255,255,255,0.8) 0px 0px 2000px inset; }

.mt-7 {margin-top: 7rem;}


main > .block-section:first-child {z-index:0;}


.bg-image-container {background-size:0 !important;}
.bg-image-container > .block-section-container {background-image:inherit; background-size:cover; background-position:center; background-repeat:no-repeat;} 
.block-inline .__content * {display:inline-block;}

:root {--divh:12rem;}
html.cms :is([class*='mb--'], [class*='transy-']) {margin-block:unset !important; transform:unset !important;}

.cols-2 .block-columns .__col {flex:1 calc(100% / 2); max-width:calc(100% / 2);}
.cols-3 .block-columns .__col {flex:1 calc(100% / 3); max-width:calc(100% / 3);}
.cols-4 .block-columns .__col {flex:1 calc(100% / 4); max-width:calc(100% / 4);}

.div-bot + div:after {z-index:10; content:""; background-color:#ffffff; position:absolute; top:-2rem; left:50%; transform:translateX(-50%) rotate(45deg); width:4rem; height:4rem;}
.div-bot + div > * {margin-top:4rem;}

/*=============================RX-CUSTOM===========================*/

@media (min-width: 768px) {
    [class*="mr--"], [class*="tr--"], [class*="ml--"], [class*="tl--"], [class*="tt--"], [class*="mt--"], [class*="tt--"] .block-columns.row, [class*="mt--"] .block-columns.row{ overflow:unset; position:relative; z-index:2;}
    .tt--5-row {transform:translateY(6rem);} .tt--5, .tt--5-row .block-columns.row {transform:translateY(-6rem);}
    .mt--5-row {margin-top:6rem;} .mt--5, .mt--5-row .block-columns.row {margin-top:-6rem;}
    .ml--5 {margin-left:-6rem;} .mr--5 {margin-right:-6rem;} 
    .tl--5 {transform:translateX(-6rem);} .tr--5 {transform:translateX(6rem);} 
    
    .text-vertical .__content > * {display: flex; flex-direction: row-reverse; width: 1rem; line-height: 1; transform: rotate(-90deg); transform-origin: top right; letter-spacing:.15em;     margin-left: -1rem !important;}
    :is(.text-center-left, .text-center-right) .sub .__content h1:first-child {transform:translateX(-50%); left:50%; margin-left:0;}
    
    .p-md-10, .pl-md-10, .px-md-10 {padding-left:6rem !important;}
    .p-md-10, .pr-md-10, .px-md-10 {padding-right:6rem !important;}
    .p-md-10, .pt-md-10, .px-md-10 {padding-top:6rem !important;}
    .p-md-10, .pb-md-10, .px-md-10 {padding-bottom:6rem !important;}
}

@media (max-height: 767px) {
    
}

@media (max-width: 2060px) {
    :root {--contwidth:1440px;}
    html, body {font-size: 18px;} 
    .lang {font-size: 1.25rem !important;}
}


@media (max-width: 1920px) {
    :root {--logo2h:150px; --contwidth:1280px;}
    
    html, body {font-size: 16px;} 
    .spacer {height: 1.5rem;}
    main > .block-section {padding: 5rem 0;}
}


@media (max-width: 1440px) {
    html, body {font-size: 14px;} 
  
}

@media (max-width: 1280px) {
    :root {--logo1h:120px; --logo2h:100px; --contwidth:900px;}
    
    html, body {font-size: 12px;} 
    h6 {letter-spacing: 2px;}
    main > .block-section {padding: 3rem 0;}
    main h1, main h2, main h3, main h4, main h5, main h6 {margin: 15px 0 0 0;}
    main :is(ul, ol) {margin: 10px 0 0 0;}
    main :is(ul, ol) li {margin: 3px 0;}
    main :is(ul, ol) li:before {padding: 0 5px 0 0;}
    
    .spacer {height: 1rem;}
    .cols-4 .block-columns .__col {flex:1 calc(100% / 3); max-width:calc(100% / 3);}
    
}

@media (max-width: 992px) {
    :root {--contwidth:100%;}
    h1 {font-size: calc(3.5rem + 0px + 0px); line-height:calc(3.5rem + 1rem + 0px);}
    h2 {font-size: calc(2.5rem + 0px + 0px); line-height:calc(2.5rem + 1rem + 0px);}
    h3 {font-size: calc(2rem + 0px + 0px); line-height:calc(2rem + 1rem);}
    h4 {font-size: calc(1.6rem + 0px + 0px); line-height:calc(1.6rem + 1rem);}
    h5 {font-size: 1.2rem;}
    
    .news .list-group-item .list-header {font-size: 1.6rem;}
    main > .block-section {padding: 3rem 15px;}
    
    
    .column-3 ul {column-count:2;}
    :is(.cols-3,.cols-4) .block-columns .__col {flex:1 calc(100% / 2); max-width:calc(100% / 2);}
}


@media (min-width: 768px) {
    @media (max-height:900px) {
        .main-slider, .home-cover {min-height:650px !important;}
    }
    
    .overflow-unset {overflow:unset !important;}

    .pc0-md .__content {padding:0 !important;}
    
    .__col.order-md-1 {order:1;}
    .__col.order-md-2 {order:2;}
    main > .block-section .__col:has(.block-section.d-md-block) {display:block;}
    main > .block-section .__col:has(.block-section.d-md-none) {display:none;}
}


@media (max-width: 767px) {
    :root {--logo2h:80px; --divh:8rem;}
    
    @media (max-height:700px) {
        .main-slider, .home-cover {min-height:600px !important;}
    }
    
    body, .block-section.bg-fixed {background-attachment:scroll;}
    h1 {font-size: calc(3rem + 0px + 0px); line-height:calc(3rem + 1rem + 0px);}
    h2 {font-size: calc(2rem + 0px + 0px); }
    h3 {font-size: calc(1.7rem + 0px + 0px); }
    
    :is(.cols-2,.cols-3,.cols-4) .block-columns .__col {flex:1 100%; max-width:100%;}

    .__col.order-1-md {order:1;}
    .__col.order-2-md {order:2;}
}

@media (min-width:559px) {
    
}

@media (max-width: 558px) {
    h1 strong {font-size:4rem;}
    :is(.testimonials .news.block-list-group, .news.block-list-group) .list-group-item {flex: 1 100%; max-width: 100%;}
    .block-text:has(.__content .table) {margin-inline:0;}
    .block-text .__content:has(.table) {overflow-x:auto; padding-inline: 0;}
}

@media (max-width: 320px) {
    h1 {font-size: calc(2.5rem + 0px);}
}



/*****************navbar menu-top *********************/
:root {--navh:180px; --navlogowid:0px;  --navtoph:2.5rem;}

main > .block-section:first-child:not(.hero,.page-cover) {padding-top:calc(var(--navh) + 5rem);}

.div-anchor {height:calc(var(--navh) + 20px); margin-top:calc(calc(var(--navh) + 20px) * -1); position:relative; z-index:-1;}
.navbar.scrolled {background:#ffffff; box-shadow:0px 2px 10px rgba(0,0,0,0.1);}
.navbar.bx {transform:translateY(-200px);}
.navbar {background: #ffffff; position:fixed; inset: 0 0 auto 0; height:var(--navh); z-index:250; transition:.3s all;}
.navbar .nav-inner {height:100%; width:100%; display: flex; flex-direction: row; justify-content: space-between; transition:.3s all;}  
.navbar .nav-inner .navbar-brand {transition:.3s all; display: flex; align-items: center; justify-content: center; /*new*/ position:relative !important; display: grid; align-content: center; grid-template-columns: 1fr;}
.navbar .nav-inner .navbar-brand img {width: calc(400px - var(--navlogowid)); max-height: 90%; max-width: 100%; z-index:2; transform-origin: top left; transition:.3s all; object-position:left; object-fit:contain; margin-right:auto; /*new*/ grid-row-start: 1; grid-column-start: 1;}
.navbar .nav-inner .navbar-brand img ~ img {z-index: 1;}
.navbar .nav-inner .navbar-brand img.hide {opacity:0;}
.navbar:has(.nav-left) .nav-inner .navbar-brand img {object-position:center; position:absolute; inset:0;}

.navbar .nav-inner .navbar-nav { margin-left:auto; width: auto; display: flex; flex-direction: row; justify-content: space-evenly; align-items: center;}

/*.navbar .nav-inner .navbar-nav, .navbar .nav-inner .socials, .navbar .nav-outer:before, .navbar .nav-outer .nav-title, .navbar .nav-outer .cta {transition:.6s all; right:-101vw !important;}*/
/*.navbar.open .nav-inner .navbar-nav {right: 0!important;}*/

.navbar .nav-inner .navbar-nav .nav-link {color:#17141b; text-transform:uppercase; transition:.3s all;}
.navbar .nav-inner .navbar-nav > .nav-item > .nav-link { font-size:2rem; color:#ffffff;}
.navbar.scrolled .nav-inner .navbar-nav > .nav-item > .nav-link {color:#2e2e2e;}
.navbar .nav-inner .navbar-nav > .nav-item {padding:0 1.3rem;display: flex; align-items: center;}
.navbar .nav-inner .navbar-nav .nav-item.nav-active > .nav-link {color: #0671b7;}
.navbar .nav-inner .navbar-nav .nav-item.dropdown {}
.navbar .nav-inner .navbar-nav .nav-link:hover {opacity:.5;}
.navbar .dropdown-toggle::after {/*float:right;*/ vertical-align:unset; margin-left:10px; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; transition:.3s all; content: "\f078" !important; border:none !important; font-size:.9rem;}
.navbar .nav-level2 .dropdown-toggle::after {position:absolute; right:1rem;}
.navbar .navbar-nav .dropdown-menu {transition:.3s all; position: absolute; border-radius: 5px; left: -5rem; right: 0; box-shadow:5px -5px 10px rgba(0,0,0,0.1);}
.navbar .navbar-nav .dropdown-menu:before {content:""; position:absolute; height:10px; width:10px; background:inherit; transform: rotate(45deg) translateX(-50%); right: 10%; top: 0;}
.navbar .navbar-nav .dropdown-menu.nav-level3 { right: 103%; left: -100%; top: 0; }
.navbar .navbar-nav .dropdown-menu.nav-level3::before { right: -8px; top: 20px; }
.navbar .navbar-nav .dropdown-menu li { }
.navbar .navbar-nav .dropdown-menu li a {padding:8px 15px;}
.navbar .nav-inner .socials {z-index:1; height:100%; display:flex; list-style:none; flex-direction: column; align-items: center; justify-content: space-evenly; align-content: center;}
.navbar:is(.no-socials, .socials-md) .nav-inner .socials {display:none;}
.navbar .nav-inner .socials li {height:100%; display:flex; gap:1rem;}
.navbar .nav-inner .socials a {height:100%; color:#ffffff; display: flex; border:none !important; text-decoration:none; transition:.3s all; width: 50px; justify-content: center;     flex-direction: column; align-items: center;}
.navbar .nav-inner .socials a:hover {}
.navbar .nav-outer, .navbar .nav-outer .nav-title, .navbar .nav-outer .cta  {display:none;}
.navbar .navbar-brand.filtered img {filter:brightness(0) invert(1);}
.navbar.scrolled .navbar-brand.filtered img {filter:none;}

.navbar.dark.scrolled {background:#17141b;}
.navbar.dark .nav-inner .navbar-nav .nav-item .nav-link, .navbar.dark .nav-outer .nav-toggler {color:#ffffff !important;}
.navbar.dark .navbar-nav .dropdown-menu, .navbar.dark .navbar-nav .dropdown-menu:before {background:#2e2e2e;}

.navbar.light {background:#e8e8e8 !important;}
.navbar.light .nav-inner .navbar-nav .nav-item .nav-link, .navbar.light .nav-outer .nav-toggler {color:#17141b;}

.nav-item.no-child:not([class*='navicon-']):hover, .nav-item.no-child:not([class*='navicon-']):hover .nav-link {background:none !important;}
.nav-item.no-child > ul, .nav-item.no-child > a:after {display:none;}

.navbar .ftr-only, footer .hdr-only, footer .nav-item .dropdown-toggle::after, footer .nav-item .children {display:none !important;}
.navbar.fixed-light {background:#ffffff !important; }
.navbar.fixed-light .nav-inner .navbar-nav > .nav-item > .nav-link {color:#0671b7;}

.navbar .socials :is(li:empty, li:has(a:empty))  {display:none;}
.navbar .socials li p {height:100%; width:100%; display:inline-block; line-height: 1;}
.navbar .socials li p a {border-radius:0; transition:0s !important; font-size:0 !important;}
.navbar .socials li p a:before {font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; font-size: 2rem !important; transition:0s; height: inherit; width: inherit; display: flex; align-items: center; justify-content: center; }
.navbar .socials li.tagnav-socials p a:before {font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands";}

.dropdown-item:focus, .dropdown-item:hover {background:transparent !important;}

.nav-top {background-color:#000; color:#ffffff; z-index: 1040; transition:.3s all; position: fixed; padding-inline: 1.1rem; font-size: .8rem; display: flex; align-items: center; height: var(--navtoph); inset:0 0 auto 0;}
.nav-top a:before {font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; margin-right:.35rem; font-size:.8rem;}
.nav-top a {color:inherit !important; font-weight:600; transition:.3s all; border:none !important; text-decoration:none !important;}
.nav-top .custom p {display:inline-block; font-size:0; letter-spacing:0; margin-left:1rem;}
.nav-top .custom p a { font-size:.8rem; letter-spacing:1px;}
.nav-top a:hover {color:#ffe600 !important;}
/*.nav-top + .navbar:not(.scrolled) {margin-top:var(--navtoph);}*/
.nav-top + .navbar {margin-top:var(--navtoph);}
/*.nav-top:has(+ .navbar.scrolled) {top:calc(calc(var(--navtoph) + .5rem) * -1);}*/
html:has(.nav-top) .page-cover {padding-block:calc(var(--navtoph) + 10rem) 2rem !important; height:unset;}

.navbar .nav-btn.btn-pop a:before {content:"\f0e0" !important; color:inherit; font-size:1rem !important; margin:0 !important;}
.navbar .nav-btn {padding-inline:.5rem !important;}
.navbar .nav-btn a:before {font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands";}
.navbar .nav-btn a {transition:0s; cursor:pointer; background:#0671b7; color:#ffffff !important; border:none !important; text-decoration:none; border-radius:30px; display:flex; align-items: center; justify-content: center; padding-inline:1rem; }
.navbar .nav-btn a:hover {background:#0671b7 !important; color:#ffffff !important;}
.navbar.scrolled .nav-btn a {/*background:#17141b; color:#ffffff !important;*/}
.navbar.dark.scrolled .nav-inner .navbar-nav .nav-btn a {background:#ffffff; color:#17141b !important;}

@media (max-width: 2050px) {
    :root {--navh:120px;}
    .navbar .nav-inner .navbar-brand img { width: calc(300px - var(--navlogowid));}
    .navbar .nav-inner .navbar-nav > .nav-item > .nav-link {font-size:2rem;}
}

@media (max-width: 1920px) {
    .navbar .nav-inner .navbar-brand img { width: calc(260px - var(--navlogowid));}
    .navbar .nav-inner .navbar-nav > .nav-item > .nav-link {font-size:2rem;}
}

@media (max-width: 1440px) {
    :root {--navh:100px;}
    .navbar .nav-inner .navbar-brand img { width: calc(220px - var(--navlogowid));}
    .navbar .nav-inner .navbar-nav > .nav-item {padding:0 1rem;}
    .navbar .nav-inner .socials a {width: 40px; }
}

@media (min-width:993px) {
    /*body:has(.hero) .navbar:not(.scrolled) .nav-inner .navbar-brand img {transform: scale(2);}*/
    
    
    .navbar .nav-item.btn-link:after, .navbar .nav-item.btn-link:before {display:none;}
    .navbar .nav-item.btn-link {padding-inline:.5rem !important; margin:0 !important; border:none; text-decoration:none !important;}
    .navbar .nav-item.btn-link > .nav-link {border:none; text-decoration:none !important; padding:.5rem 1rem; background:#0671b7 !important; color:#ffffff !important; border-radius:30px; transition:.3s all; font-weight: normal !important;}
    
    .navbar:has(.navbar-nav.nav-left) .nav-inner {}
    .navbar:has(.navbar-nav.nav-left) .nav-inner > * {flex: 1 100%;}
    .navbar:has(.navbar-nav.nav-left) .navbar-brand {margin-right:0; flex: 1 50% !important; display:flex;}
    .navbar:has(.navbar-nav.nav-left) .navbar-brand img {margin:auto; transform-origin:center;}
    .navbar .navbar-nav.nav-left {margin-inline:0 auto !important; justify-content: flex-start;}
    .navbar .navbar-nav.nav-right {justify-content: flex-end;}
    .navbar .navbar-nav.nav-left :is(.nav-break, .nav-break ~ .nav-item),
    .navbar .navbar-nav.nav-right :is(.nav-break, .nav-item:has(~ .nav-break)) {display:none !important;}
    
    
    .navbar .nav-inner .navbar-nav {padding-right:.5rem;}
    .navbar .nav-item[class*='navicon-'] {padding-inline: 0.4rem !important; position:unset;}
    .navbar .nav-item[class*='navicon-'] > a {font-size:0 !important; opacity:1 !important; color:#ffffff !important; background: #0671b7; height: 3rem; width: 3rem; display: flex; align-items: center; justify-content: center; border-radius: 50%;}
    .navbar .nav-item[class*="navicon-"].nav-active > a {background:#ffe600;}
    .navbar .nav-item[class*='navicon-'] > a i {font-size:1.2rem !important;}
    .navbar .nav-item[class*='navicon-'] > a span {transition:.3s all; transform-origin:top center; transform:scale(0) translateY(-1rem); opacity:0; position:absolute; font-size: .7rem; background: inherit; padding: 0.2rem 0.5rem; bottom: 0; border-radius: 3px;}
    .navbar .nav-item[class*='navicon-'] > a:hover span {transform:scale(1) translateY(0); opacity:1;}
    .navbar .nav-item[class*='navicon-'] > a span:before {content:""; position:absolute; background:inherit;     width: 0.8rem; height: 0.8rem; top: -0.2rem; left: 50%; transform: translateX(-50%) rotate(45deg); z-index: -1;}
    
    .navbar .nav-inner .socials .tagnav-contact {display:none;}
    
    .navbar .nav-inner .socials {display: flex; flex-direction: row; gap: 1rem; align-items: center; padding-inline:1rem;}
    .navbar .nav-inner .socials li {height: auto;}
    .navbar .nav-inner .socials li a {transition:.3s opacity !important; padding-inline:1rem; border-radius:0; height:2rem; width:2rem;}
    .navbar .nav-inner .socials li a:hover {opacity:.5;}
    .navbar.scrolled .nav-inner .socials li a {color:#17141b !important;}
    .navbar .nav-inner .socials li a:hover {color:#ffffff;}
    .navbar.dark.scrolled .nav-inner .socials li a {color:#ffffff !important;}
    
    .navbar .ftr-only-md {display:none !important;}
    
}


@media (min-width: 1px) {
    :root {--navtoph:6rem;}
    
    .nav-top {display:none;}
    .nav-top + .navbar {margin-top:0;}
    
    .navbar .nav-inner .navbar-nav, .navbar .nav-inner .socials, .navbar .nav-outer:before, .navbar .nav-outer .nav-title, .navbar .nav-outer .cta {transition:.6s all; right:-101vw !important;}
    .navbar.open .nav-inner .navbar-nav, .navbar.open .nav-inner .socials, .navbar.open .nav-outer:before, .navbar.open .nav-outer .nav-title, .navbar.open .nav-outer .cta {right:0 !important;}
    .navbar {backdrop-filter:none; -webkit-backdrop-filter:none;}
    
    .navbar .nav-item[class*='navicon-'] > a i {display:none !important;}
    .navbar .nav-item.nav-btn a.nav-link {background:transparent !important; color:#17141b !important; font-size:1rem !important; width: 100%; justify-content: flex-end; padding-inline: 1rem; flex-direction: row-reverse;}
    .navbar .nav-item.nav-btn a.nav-link:before {margin-left:1rem !important;}
    
    .navbar .navbar-nav.nav-left, .navbar .navbar-nav.nav-right .nav-break {display:none !important;}

    .navbar:has(.nav-left) .nav-inner .navbar-brand img {object-position:left; inset:1rem; height:80%;}
    .navbar:has(.nav-left) .nav-inner .navbar-brand {display:flex !important; align-content:center !important;}
    
    .navbar .nav-inner {max-width:100% !important; margin-inline:unset !important;}
    .navbar .nav-inner .navbar-nav {top: 0 !important; height:100%; position: fixed; width: 50%; inset: 100px 0px 50px 0; background: linear-gradient(to right, transparent, rgba(255,255,255,0.8) 40%); overflow-y: auto; padding:5rem 1rem; display: flex; flex-flow: column wrap; align-items: flex-end; justify-content: flex-start; flex-direction: column; flex-wrap: nowrap;}
    .navbar .nav-inner .navbar-nav li {display: flex; flex-direction: column; align-content: flex-start; align-items: flex-start !important; flex-wrap: wrap;}
    .navbar .nav-inner .navbar-nav .nav-item .nav-link {color:#4f4f4f; font-weight: 700;}
    .navbar .nav-inner .navbar-nav > .nav-item {padding:0 5rem;}
    /*.navbar .nav-inner .navbar-nav > li {border-bottom:1px solid #d9d9d9;}*/
    /* .navbar .nav-inner .navbar-nav > li:first-child {border-top:1px solid #d9d9d9;} */
    .navbar .navbar-nav .dropdown-menu {margin-bottom: -1px; position: relative; left: -1.5rem; top: auto; width: calc(100% + 3rem); box-shadow:0px 5px 10px rgba(0,0,0,0.1); border-radius:0;}
    .navbar .navbar-nav .dropdown-menu li a {padding:8px 1.5rem;}
    .navbar .navbar-nav .dropdown-menu.nav-level2 {background: #e8e8e8;}
    .navbar .navbar-nav .dropdown-menu.nav-level3 {left: 0 !important; width: 100%; top: auto; position: relative; box-shadow: none; background: #d9d9d9; padding-left:1.8rem;}
    .navbar .nav-inner .navbar-nav .nav-level3 li {border-left:1px solid #e8e8e8;}
    .navbar .navbar-nav .dropdown-menu::before {display:none;}
    .navbar .nav-inner .socials {display: flex; position: fixed; inset: auto 0px 0px auto; flex-direction: row; height: 50px; width: 75%;}
    .navbar .nav-inner .socials li, .navbar .nav-inner .socials li a {width:100%; gap:0px;}
    .navbar .nav-inner .socials li a {background:linear-gradient(45deg, #7a7a7a, #4f4f4f); font-size:2rem;}
    .navbar.dark .nav-inner .socials li a {background:linear-gradient(45deg, #4f4f4f, #0B0D11);}
    .navbar .dropdown-toggle::after {font-size:.8rem; top:1.2rem; position:absolute; right:1rem;}
    .navbar .nav-inner .navbar-brand {padding-right:0; position: absolute; height: 100%; z-index: 5; width:70%;}
    
    .navbar.no-socials .nav-inner .navbar-nav {bottom:0;}
    .navbar.dark .nav-inner .navbar-nav {background:#17141b;}
    .navbar.dark .navbar-nav .dropdown-menu.nav-level2 {background:#2e2e2e;}
    .navbar.dark .navbar-nav .dropdown-menu.nav-level3 {background:#4f4f4f;}
    .navbar:not(.open) .nav-inner {z-index:1; width:80%;}
    
    .navbar .nav-outer {display: flex; position: fixed; top: 0; right: 0; width: 50%; justify-content: space-between; padding: 1rem;}
    /*.navbar .nav-outer:before {background: #ffe600; content:""; top: 0; bottom: 0; width: 100%; position:absolute; z-index:-1;}*/
    .navbar .nav-outer:before {background: linear-gradient(to right, transparent, $opac6dark, 40%); }
    .navbar.dark .nav-outer:before {background: #0B0D11 !important;}
    .navbar .nav-outer .nav-toggler {order:2; color:#0671b7;}
    .navbar.fixed-light .nav-outer .nav-toggler {color:#0671b7;}
    .navbar.scrolled .nav-outer .nav-toggler {color:#0671b7;}
    .navbar.scrolled .nav-outer .nav-toggler {color:#0671b7;}
    .navbar .nav-outer .nav-toggler {text-decoration:none; }
    .navbar .nav-outer .nav-toggler i {font-style:normal !important;}
    .navbar.open .nav-outer .nav-toggler {background:transparent;}
    .navbar .nav-outer .nav-title {position:relative; order:1; display:flex;}
    .navbar .nav-outer .nav-title a {text-decoration:none !important; border:none !important;}
    .navbar .nav-outer .nav-title a * {color:#ffffff; font-weight:700;}
    .navbar .nav-outer .cta {}
    
    .navbar .nav-toggler:before {content: "MENY"; position: absolute; right: 5rem; margin-top: 14px; font-weight: 700; color: #0671b7; transition: .3s all;}
    .navbar.open .nav-outer .nav-toggler:before {content: "";}
    .navbar.socials-md .nav-inner .socials {display:flex;}
    html:has(body .navbar.open) {overflow-y:hidden;}
    
    
}
@media (min-width: 768px) {
    .navbar .nav-inner .navbar-nav {width: 50%;}
    .navbar.socials-md .nav-inner .socials {width: 50%; background: linear-gradient(to right, transparent, $opac6dark 40%);}
}
@media (max-width: 767px) {
    .navbar .nav-inner .navbar-nav {width: 75%;}
    .navbar .nav-inner .navbar-nav, .navbar .nav-outer:before {background: $opac6dark;}
    .navbar .nav-inner .navbar-nav li a { font-size:1rem;}
    .navbar .socials li p a:before {font-size: 1.5rem;}
}

@media (max-width: 558px) {
    
    .navbar .nav-inner :is(.navbar-brand, .navbar-brand img) {transition:.3s all;}
    .navbar .nav-inner .navbar-nav, .navbar .nav-inner .socials, .navbar .nav-outer {width: 100%;}
    .navbar.open .navbar-brand img {opacity:0;}
}

@media (max-width: 320px) {

}





/***************FOOTER*****************/

footer {position: relative;}
footer > .container-fluid {padding-block:5rem;}
footer > .container-fluid > .container {padding-inline:15px;}
footer .container-fluid:not(.ftr-copyright) .row h6 {font-weight:700; margin-bottom:1rem; padding-bottom:1rem; border-bottom:1px solid rgba(255,255,255,0.3); color: #0671b7 !important;}
footer .container-fluid:not(.ftr-copyright) .row .text-dark h6 {border-color:rgba(0,0,0,0.1) !important;}
footer .container-fluid .row {column-gap:2rem; margin-inline:0;}
footer .container-fluid .col {flex:1;}
footer .container-fluid .row h5 p {margin-bottom:.5rem;}
footer .container-fluid .row span p {margin-bottom:.25rem;}
footer .container-fluid .row a {transition:.3s all;}
footer .container-fluid .row a:hover {opacity:.75; text-decoration:none !important;}

html.cms footer .ftr-banner {display:none;}
footer .ftr-banner {background-size:cover; background-position:center; background-color:#17141b; overflow:hidden; position:relative;}
footer .ftr-banner > .container {padding-block:2rem;}
footer .ftr-banner:before {transition:.3s all; content:""; position:absolute; background-color:black; opacity:.6; inset:0;}
footer .ftr-banner:hover:before {opacity:.5;}
footer .ftr-banner *:not(:first-child) {margin-top:1.5rem;}
footer .ftr-banner.text-light a {margin-top:1rem; background-color:#ffffff; color:#17141b !important; border:none !important;}
footer .ftr-banner.text-light a:hover {background-color:#e8e8e8 !important; color:#17141b !important;}

footer .ftr-menu {line-height:1.5; padding-block:0; background:url("https://www.ronimedical.se/assets/images/favicon.svg") 50% 20% / cover no-repeat scroll; background-blend-mode: overlay; border-top: 1px solid #e8e8e8 !important;}
footer .ftr-menu .row .col.contact {border-left: none !important;}
footer .ftr-menu .row .col {padding:4rem 3rem; border-left: 1px solid #e8e8e8;}
footer .ftr-menu ul {list-style:none; padding:0;}
footer .ftr-menu ul li a { padding:0;}
footer .ftr-menu .nav-link:after, footer .ftr-menu .dropdown-menu {display:none !important;}
footer .ftr-menu .nav-item.d-md-none {display:list-item !important;}
footer .ftr-menu .contact a:before {display:none;}
footer .ftr-menu .contact h5 p {line-height:normal;}
footer .ftr-menu .contact h5 p em {font-size:.9rem;}
footer .ftr-menu .contact h5 p a {display:block; margin-top:.25rem;}
footer .ftr-menu .contact h5 p:has(strong) a[href*='tel']:before {content:"\f095"; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; margin-right:5px; display:inline-block; font-size:1.2rem;}
footer .ftr-menu .ftr-logo {display:block; margin-bottom:1rem;}
footer .ftr-menu .ftr-logo img {max-height: 8rem; max-width: 60%; width:100%; object-fit:contain; object-position:left; margin-inline:0 auto;}
footer .ftr-menu .ftr-logo ~ * {margin-top:.75rem;}
footer .ftr-menu .ftr-logo:before {display: none;}

footer .ftr-menu .ftr-menu-socials :is(p:empty, p:has(a:empty)) {display:none !important;}
footer :is(.text-center) .ftr-menu-socials {justify-content:center;}
footer .ftr-menu .ftr-menu-socials {display:flex; gap:.7rem; margin-inline:-5px; margin-top:1rem;}
footer .ftr-menu .ftr-menu-socials p a {letter-spacing:0; font-size:0; align-items: center; justify-content: center; display:flex; height:3.2rem; width:3.5rem; color:#ffffff; border-radius:0rem;}
footer .ftr-menu .ftr-menu-socials p a:before {display:block !important; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; font-size:3.2rem;}
footer .ftr-menu .ftr-menu-socials + p > a {letter-spacing:1.5px; margin-top:1rem; display:block; text-transform:uppercase; letter-spacing:1px;  background-color:transparent !important; color:inherit !important; border:none !important; padding:0; border-radius:0; font-weight:500; letter-spacing:1px;}
footer .ftr-menu .ftr-menu-socials + p > a:after {content:"\f061"; font:600 1rem "Font Awesome 5 Free","Font Awesome 5 Brands"; color:inherit; margin-left:1rem; transition:.3s all;}
footer .ftr-menu .ftr-menu-socials + p > a:hover:after {margin-left:1.5rem;}
footer .ftr-menu .ftr-menu-list {column-count:2; margin-top:-.5rem;}
footer .ftr-menu .ftr-menu-list.custom {column-count:1; margin-top:2rem; font-size:.8rem;}
footer .ftr-menu .ftr-menu-list li:first-child {}
footer .ftr-menu .ftr-menu-list li a, footer .ftr-opening-list li {padding-bottom:.5rem; margin-bottom:.5rem; border-bottom:1px solid #e8e8e8;}
footer .ftr-menu .text-dark .ftr-menu-list li a {border-color:rgba(0,0,0,0.1);}

footer .ftr-copyright .row h6 {margin-bottom:0 !important;}

footer .img-d-flex {display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 1rem;}
footer .img-d-flex a {flex:1;}
footer .img-d-flex img {width:100%;}

footer .nav-break {display:none !important;}

@media (max-width:767px) {
    footer > .container-fluid > .container {padding-inline:2.5rem;}
    footer .container-fluid .col {padding-inline:0px; flex:100%;}
    footer .ftr-menu .row .col {padding-inline:2.5rem;}
    footer :is(.text-left-center, .text-right-center) .ftr-menu-socials {justify-content:center;}
}


/*******WEBSHOP-V3********/

:root { 
    --boradius: 1.5rem; 
    --border:rgba(0,0,0,0.1); 
    --opac:#b5e0fd; 
    --primary: #405978;
    --light: #f6fafd;
    --dark: #031121;
    --white: #eeeeee;
    --black: #000000;
    --fonticon: 600 1em "Font Awesome 5 Free","Font Awesome 5 Brands";
    --trans: .3s;
    --slow: 1s;
}
/*webshop-v2-240919*/
/*html:has(.navbar.scrolled.bx) {--navh:0px !important;}*/

html:has(.webshop) main > .block-section:first-child:not(.hero,.page-cover) {padding-top:calc(var(--navh) + 5em);}
.webshop .box-loader, .webshop #shop-loader-bg {background-color:transparent; backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px);}
.webshop {font-size:25px; color:var(--dark); min-height:100vh;}
.webshop a:before, .webshop a:after, .webshop .row:before, .webshop .row:after {display:none;}
.webshop a {border:none; text-decoration:none;}
.webshop .btn, .webshop .btn:after {font-size:1em;}
:is(html:has(.webshop) .popover,.webshop) :is(input,.form-control) {padding-inline:1em; height:unset; font-size:1em; border-radius:var(--boradius); border-color:var(--border); box-shadow:none !important; outline:none !important;}
.webshop .shop-container {display: flex; flex-direction: row; gap:2em; align-items: flex-start; position:relative;}

.webshop .shop-container .shop-menu {
    width:100%; max-width:20vw; max-height:100%; border:1px solid var(--border); padding:1em; border-radius:var(--boradius); overflow:hidden; transition:var(--trans); flex:1;
    .shop-menu-title {align-items: center; text-transform:uppercase; font-size:1.25em !important; display: flex; justify-content: space-between;}
    .shop-menu-toggler {display:none; height:2.3em; width:2.3em; align-items: center; justify-content: center; border:1px solid var(--border); border-radius:var(--boradius); background-color:var(--opac)}
    .shop-menu-toggler:before {display:flex; content:"\f066"; font:var(--fonticon);}
}
/*css-category*/
.webshop .shop-container .shop-menu .shop-menu-list {
    max-width:100%; max-height:100%; transition:var(--trans);
    li:before {display:none;}
    li:last-child {margin-bottom:0;}
    li a {letter-spacing:normal; margin:0; font-size:1em; line-height:normal; display:flex; width:100%; padding-block:.5em !important;}
    li a:hover {color:var(--primary);}
    li.active > a {font-weight:600; color:var(--primary); border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
    > li:first-child {border-top:1px solid var(--border);}
    > li:last-child {border-bottom:none !important;}
    > li {margin-block:0; border-left:1px solid transparent; border-bottom:1px solid var(--border); border-radius:0; }
    > li.active {border-color:var(--border); border-radius:0;}
    /*> li:not(:last-child) {margin-bottom:.5em;}*/
    > li > a {border-radius:inherit; padding:.5em 1em;}
    > li > ul {margin-right:1em;}
    li.has_children ul {transition:var(--trans); height: 100%; margin-left:1.2em; max-height:0px; overflow:hidden; padding-block:0 !important; }
    li.has_children.active > ul {padding-block:.5em !important;}
    li.has_children ul li {margin:0;}
    li.has_children li a {font-size:1.1em; padding-block:.5em !important;}
    li.has_children li ul.children {padding-block:0 !important;}
    li.has_children > a {position:relative; padding-right:3em;}
    li.has_children > a > span {transition:var(--trans); z-index:2; font-size:.8em; width: 2em; height: 100%; display:flex; align-items: center; justify-content: center; position: absolute; right: .5em; top: 50%; transform: translateY(-50%); border-left:1px solid var(--border);}
    li.has_children > a > span:after {content:"\f067"; font:var(--fonticon); font-size:inherit;}
    li.has_children > a[data-href="#"]:active > span, li.has_children > a > span:hover {}
    li.has_children.active > a > span:after {content:"\f068";}
    li.has_children.active > a:not(:last-child) {border-bottom:1px solid var(--border);}
    li.active.has_children > ul {max-height: 100vh !important;}
    ul.level1 > li > a > span {right:-.4em;}
    ul.level2 {margin-left:0 !important; border-left:1px solid var(--border);}
    ul.level2 li {}
    ul.level2 li a {border-bottom:1px solid var(--border); padding-left:1em;}
    ul.level2:last-child {padding-bottom:0 !important;}
    
}
/*css-main*/
.webshop .shop-container .shop-main {
    width:100%; /*border:1px solid var(--border); padding:1em; */ border-radius:var(--boradius); transition:var(--trans); flex:1;
    
    .shop-main-filter {position::relative;}
    #shop-menu-top {padding:0; display: flex !important; flex-direction: row; flex-wrap: nowrap !important; margin-bottom:1em; align-items: flex-end !important;}
    #shop-menu-top .topnav-menu-left {font-family:var(--font2); flex:1 50%; margin:0 !important; font-size:1.65em; line-height:1.5; width:50%; text-align:left !important; font-weight:600; padding-right:1em; margin-block:auto !important;}
    #shop-menu-top .topnav-menu-right {flex:1 50%; margin: 0; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-end; align-items: center; gap:0;}
    #shop-menu-top .topnav-menu-right li {min-width:unset; margin:0;}
    #shop-menu-top .topnav-menu-right li:before {display:none;}
    #shop-menu-top .nav-link {border:1px solid var(--border); border-radius:var(--boradius); }
    #shop-menu-top .nav-link:is(:active,:focus) {background:var(--opac) !important; color:var(--primary) !important; opacity:1;}
    #shop-menu-top #shop-search-container .nav-link {border-top-right-radius:0; border-bottom-right-radius:0; border-right-color:transparent !important;}
    #shop-menu-top #shop-cart .nav-link {border-top-left-radius:0; border-bottom-left-radius:0;}
    #shop-menu-top:has(#shop-cart.show) #shop-search-container .nav-link {border-bottom-left-radius:0;}
    
    #shop-menu-top .nav-link, #shop-toolbar .toolbar-left button.toolbar-view-entry {font-size:1.3em; padding:.25em 1em; min-height: 2.5em; align-content: center; }
    
    /*css-search*/
    #shop-menu-top .topnav-menu-right li.topmenu-search {
        width:100%;
        #shop-search-container {display: flex; align-items: center; width: 100%; justify-content: flex-end; align-items: stretch;}
        #shop-search-container:has(+#shop-search-results.show.open) :is(#shop-search-field.open + .nav-link, #shop-search-field.open > input) {border-bottom-left-radius:0 !important; border-bottom-right-radius:0 !important;}
        #shop-search-field {opacity:0;max-width:0px; width:100%; transition:var(--trans); display:block !important;}
        #shop-search-field.open {opacity:1;max-width:100vw;}
        #shop-search-field.open input {border-bottom-right-radius:0;border-top-right-radius:0;}
        #shop-search-field.open + .nav-link {border-bottom-left-radius:0;border-top-left-radius:0; background-color:var(--opac);}
        input {max-width:100%; box-shadow:unset !important; border-radius:var(--boradius); border:1px solid var(--border); border-right:none !important; height:100%; transition:var(--trans);}
        #shop-search-results {font-size:.8em; overflow-y: auto; max-height: 50vh; border:1px solid var(--border); padding-block:0; overflow-x:hidden; border-radius:var(--boradius) 0 var(--boradius) var(--boradius);}
        #shop-search-results.show.open:empty {display: flex; justify-content: center; align-items: center; width: 100%; border-top-left-radius: 0 !important;}
        #shop-search-results.show.open:empty:before {content:"Inga sökresultat"; opacity:.5;}
        #shop-search-results > .row:first-child {padding-block:.75em; align-items:center; padding-right:.5em;}
        #shop-search-results > .row:first-child h6 {margin:0; font-weight:600; font-size: 1em; letter-spacing: 1px; margin-left: 5px;}
        #shop-search-results #shop-search-all {border-bottom: 1px dashed; line-height: normal; text-transform: uppercase; font-size: .9em;}
        #shop-search-results .quick-search-entry {border-right:none !important; border-left:none !important; background-color:transparent; line-height:normal; padding-right:1em;}
        #shop-search-results .quick-search-entry .row {align-content: center; align-items: center;}
        #shop-search-results .quick-search-entry [class*="col-"]:has(img) {padding-right:0;}
        #shop-search-results .quick-search-entry img {height: 5em; width:100%; max-width:unset; object-fit: contain; object-position: center;}
        #shop-search-results .quick-search-entry br {display:none;}
        #shop-search-results .quick-search-entry [class*="col-"]:nth-child(2) > strong {display:block;}
        #shop-search-results .quick-search-entry:hover .product-stock {font-size:1em; }
        #shop-search-results .quick-search-entry .product-stock {font-size:0px; letter-spacing:0; transition:var(--trans);}
        #shop-search-results .quick-search-entry .product-stock:before {content:"\f00c"; font:var(--fonticon); font-size:small; color:inherit; margin-right:5px;}
        #shop-search-results .quick-search-entry .product-stock.out_of_stock:before {content:"\f00d";}
        #shop-search-results .quick-search-entry [class*="col-"]:last-child {padding-left:0; text-align:right;}
        #shop-search-results .quick-search-entry [class*="col-"]:last-child .product-price {display: flex; flex-direction: column; letter-spacing:0; color:var(--primary);}
        #shop-search-results .quick-search-entry [class*="col-"]:last-child span.number {font-size:1.2em; font-weight:600;}
        #shop-search-results .quick-search-entry [class*="col-"]:last-child span.currency {font-size:.9em; margin-top:-2px;}
    }
    
    /*css-cart*/
    #shop-menu-top .topnav-menu-right li.topmenu-cart {
        #shop-cart {}
        #shop-cart.show > .nav-link {background-color:var(--opac); border-bottom-left-radius:0; border-bottom-right-radius:0;}
        #shop-cart > .nav-link .badge {background:var(--primary);}
        #shop-cart .dropdown-menu.show {}
        #shop-cart .dropdown-menu:not(:has(>.text-center)) {width:40vw; }
        #shop-cart .dropdown-menu:has(>.text-center) {min-width:15em; }
        #shop-cart .dropdown-menu {
            font-size:inherit;  padding:0; margin:-1px 0 0 0 !important; border:1px solid var(--border); overflow-x:hidden; overflow-y:auto; max-height:60vh; border-radius:var(--boradius); border-top-right-radius:0;
            > .text-center {opacity:.5; font-size: .8em; line-height:normal; padding: 1em;}
            > .row {margin:0;}
            > .row:nth-child(1) > div {padding:0;}
            > .row:nth-child(2) {position: -webkit-sticky; position: sticky; inset: auto 0 0 0;}
            .cart-footer {margin:0; padding:1em 2em; background-color:var(--opac); display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;}
            .cart-footer > p {margin:0; font-size:1.3em; font-weight:600; line-height:normal;}
            .cart-footer > p :is(strong,span) {font-weight:300; font-size:.8em;}
            .cart-footer > p span {display:block; line-height:normal; font-style:italic; font-size:.6em;}
            .cart-footer .btn.cart-button {margin:0; padding:.7em 1.2em;}
            .cart-footer .btn.cart-button:after {content:"\f061"; font:var(--fonticon); color:inherit; margin-left:1em; display:flex;}
            :is(.cart-list, .cart-list > li, .cart-list li .row) {margin:0;}
            .cart-list {padding-bottom:0 !important;}
            .cart-list > li {line-height:normal; width:100%; padding-right:1em;}
            .cart-list > li:last-child {border-bottom:none !important;}
            .cart-list .cart-item-row-1 {display: flex; align-items: flex-end;}
            .cart-list .cart-item-row-1 > [class*='col']:first-child {padding-right:0;}
            .cart-list .cart-item-row-1 > [class*='col']:nth-child(2) {padding-inline:0;}
            .cart-list .cart-item-row-1 > [class*='col']:nth-child(2) [class*='col']:has(*:empty) {display:none;}
            .cart-list .cart-item-row-1 > [class*='col']:last-child {padding-left:0; text-align:right;}
            .cart-list .cart-item-row-1 > [class*='col']:last-child [class*='col'] {padding-inline:0;}
            .cart-list .cart-item-row-1 img {height: 5em; width:100%; object-fit: contain; object-position: center;}
            .cart-list .cart-item-row-1 a {margin:0 !important;}
            .cart-list .cart-item-row-2 {display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between;}
            .cart-list .cart-item-row-2 > div {flex: 1 !important; max-width: unset; margin:0;}
            .cart-list .cart-item-row-2 .btn {margin:0;}
            .cart-list .cart-item-row-2 .input-group {display: flex; flex-direction: row; flex-wrap: nowrap; align-items: stretch;}
            .cart-list .cart-item-row-2 .input-group input {width:100%; border-radius:var(--boradius) 0 0 var(--boradius); border:1px solid var(--border); box-shadow:none !important; outline:none !important;}
            .cart-list .cart-item-row-2 .input-group .btn {height:100%; border-radius:0 var(--boradius) var(--boradius) 0;}
            .cart-list .cart-item-row-2 .input-group .btn:after {display:none;}
            .cart-list .cart-item-row-2 .btn.control-cart-item-delete {background: var(--danger); height: 100%; width: 4em; display: flex; align-items: center; justify-content: center;}
            .cart-list .cart-item-row-2 > div:nth-child(2) {display:flex; justify-content: flex-end;}
        }
        
    }
    
    /*cart-fixed*/
    
    #shop-cart .dropdown-menu:not(:has(> .text-center)) {
        padding-top:1.5em !important; position: fixed !important; max-height: calc(100vh - var(--navh) - 4em) !important; min-height: calc(100vh - var(--navh) - 8em) !important; inset: calc(var(--navh) + 2em) -1px auto auto !important; transform: none !important; z-index: 300000; border-radius: var(--boradius) 0 0 var(--boradius);
        > .row:nth-child(1) {min-height:inherit;}
        > .row:nth-child(1) > div {padding-inline:0;}
        > .row:nth-child(1) ul.cart-list {height: 100%; max-height: unset;}
        > a.close {position:absolute; inset:0 auto auto 0; font-size:1.2em; height:2em; width:2em; display:flex; align-items:center; justify-content:center; border-radius:var(--boradius) 0 var(--boradius) 0; border:1px solid var(--border); border-top:none !important; border-left:none !important; background-color:var(--opac); color:var(--dark); opacity:1;}
    }
    
    /*css-filter*/
    .shop-main-cards {
        #shop-toolbar {border-bottom: 1px solid var(--border); padding-bottom: 2em; margin-bottom:0; background:transparent;} 
        #shop-toolbar .btn {font-size:.9em;}
        #shop-toolbar .toolbar-left {width:100%;}
        #shop-toolbar .toolbar-left button {border-radius:var(--boradius); border:1px solid var(--border) !important; color:var(--dark);}
        #shop-toolbar .toolbar-left button:is(:active,:focus) {background:var(--opac) !important; color:var(--primary) !important; opacity:1;}
        #shop-toolbar .toolbar-left button:after {display:none;}
        #shop-toolbar .toolbar-left button.toolbar-view-entry {display: flex; align-items: center; justify-content: center;}
        #shop-toolbar .toolbar-left button.toolbar-view-entry.active {background-color:var(--opac);}
        #shop-toolbar .toolbar-left button.toolbar-view-entry > i:before {content:"\f009"; font:var(--fonticon);}
        #shop-toolbar .toolbar-left:has(button.toolbar-view-entry#shop-gallery-view.active) #shop-list-view {border-left:none !important;}
        #shop-toolbar .toolbar-left:has(button.toolbar-view-entry#shop-list-view.active) #shop-gallery-view {border-right:none !important;}
        #shop-toolbar .toolbar-left button.toolbar-view-entry#shop-list-view > i:before {content:"\f00b";}
        #shop-toolbar .toolbar-left button.toolbar-view-entry#shop-gallery-view {border-top-right-radius:0; border-bottom-right-radius:0;}
        #shop-toolbar .toolbar-left button.toolbar-view-entry#shop-list-view {border-top-left-radius:0; border-bottom-left-radius:0;}
        
        #shop-toolbar .toolbar-left :is(button.toolbar-sort-btn, button.toolbar-sort-btn + .dropdown-menu) {width:15em; max-width:unset !important;}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn {margin-left:auto; padding:1em 2em;}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn[aria-expanded="true"] {background-color:var(--opac); border-bottom-left-radius:0; border-bottom-right-radius:0;}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn span {margin-left:auto;}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn span.caret:after {content:"\f0d7"; font:var(--fonticon);}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn + .dropdown-menu {font-size:.9em; overflow:hidden; background:var(--light); border:1px solid var(--border); border-radius:0 0 var(--boradius) var(--boradius); }
        #shop-toolbar .toolbar-left button.toolbar-sort-btn + .dropdown-menu li {padding:0; margin:0; background:transparent;}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn + .dropdown-menu li.active {background:var(--opac); color:var(--primary);}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn + .dropdown-menu li:before {display:none;}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn + .dropdown-menu li a {padding:.2em 1.9em !important; width: 100%; display: inline-block;}
        #shop-toolbar .toolbar-left button.toolbar-sort-btn + .dropdown-menu li:not(:last-child) a {border-bottom:1px dashed var(--border);}
    }
    
    /*css-product-gallery*/
    #product-list {font-size:.9em;}
    
    #product-list[data-view="0"] {
        padding-top:2em;
        .product-list-container {margin:0; display: grid;  grid-template-columns: 1fr 1fr 1fr 1fr;  gap: 2em;}
        .product-list-container > div {padding:0; flex:unset; max-width:unset;}
        .product-list-container .product-item {display: flex; flex-direction: column; justify-content: flex-end; position:relative; padding:1em; height:100%; margin:0 !important; transition:var(--trans); box-shadow:none !important; background:var(--white); border:1px solid var(--border); border-radius:var(--boradius); overflow:hidden;}
        .product-list-container .product-item .label-discount {color:white; position: absolute; inset:auto 1em 0 auto; margin-top:-1em; z-index:2; border-radius: 50%; overflow: hidden; height: 3em; width: 3em; font-size: .9em; padding: 0; display: flex; align-items: center; justify-content: center; letter-spacing: 0px;}
        .product-list-container .product-item .image {height:100% !important; margin:0 0 1em 0; overflow:hidden; border-radius:var(--boradius); border:1px solid var(--border); }
        .product-list-container .product-item .image img {height:100% !important; transition:var(--slow) all, var(--trans) transform 1s; border-radius:inherit; background-color:var(--light);}
        .product-list-container .product-item:has(.product-stock.out_of_stock):not(:hover) .image img {filter:saturate(0) brightness(0.8);}
        .product-list-container .product-item:hover .image {padding-inline:0;}
        .product-list-container .product-item:hover .image img {transform-origin:left; transform:scale(1.5); animation:pan 10s linear infinite;}
        .product-list-container .product-item .product-label {margin:0;}
        .product-list-container .product-item .product-title {margin-top:auto; height: unset; line-height: normal; padding: 0;}
        .product-list-container .product-item:has(.price-ordinary) .product-title {padding-right:4em;}
        .product-list-container .product-item .product-price {line-height: 1; padding: 0; font-size: 1.5em; font-weight: 600; letter-spacing:0px;}
        .product-list-container .product-item .product-price + .price-ordinary {padding: 0; line-height: normal; display: block;}
        .product-list-container .product-item .product-price + .price-ordinary .currency {font-size:inherit;}
        .product-list-container .product-item .product-stock {position: absolute; inset: auto .8em .2em auto; line-height:2; font-size:0px; letter-spacing:0; transition:var(--trans);  display: flex; flex-direction: row-reverse; align-items: center;}
        .product-list-container .product-item .product-stock:before {content:"\f00c"; font:var(--fonticon); font-size:small; color:inherit; margin-left:5px; line-height:inherit;}
        .product-list-container .product-item .product-stock.out_of_stock:before {content:"\f00d";}
        .product-list-container .product-item:hover .product-stock {font-size:.8em;}
    }
    
    /*css-product-list*/
    #product-list[data-view="1"] {
        .product-list-container {}
        .product-list-container > div {}
        .product-list-container .product-item {height:unset;}
        .product-list-container .product-item > .row {height:100%; display: grid; 
          grid-template-columns: 20% 1.2fr 0.5fr; 
          grid-template-rows: auto auto auto; 
          gap: 0px 0px; 
          grid-template-areas: 
            "image title button"
            "image stock button"
            "image price button"; 
        }
        .product-list-container .product-item > .row > div {flex:unset; max-width:100%;}
        .product-list-container .product-item > .row > div:nth-child(1) {grid-area: image;}
        .product-list-container .product-item > .row > div:nth-child(2) {grid-area: title; position:unset;}
        .product-list-container .product-item > .row > div:nth-child(3) {grid-area: stock;}
        .product-list-container .product-item > .row > div:nth-child(4) {grid-area: price; flex-direction: row !important;}
        .product-list-container .product-item > .row > div:nth-child(5) {grid-area: button; display: flex; justify-content: flex-end; align-content: center; align-items: center;}
        .product-list-container .product-item > .row > div:nth-child(n+2):nth-child(-n+4) {display: flex; align-items: flex-start; align-content: center; justify-content: flex-start; flex-direction: column;}
        .product-list-container .product-item .image {height:100% !important; margin:0; overflow:hidden; border-radius:calc(var(--boradius) / 2); border:1px solid var(--border); }
        .product-list-container .product-item .image img {max-width:unset;  max-height: 8em; height:100% !important; transition:var(--slow) all, var(--trans) transform; border-radius:inherit; background-color:var(--light); width: 100%;}
        .product-list-container .product-item:has(.product-stock.out_of_stock):not(:hover) .image img {filter:saturate(0) brightness(0.8);}
        .product-list-container .product-item:hover .image img {transform-origin:left; transform:scale(1.5); animation:pan 10s linear infinite;}
        .product-list-container .product-item .product-label {margin:0;}
        .product-list-container .product-item .product-title {font-size:1.1em; margin-top:auto; height: unset; line-height: normal; padding: 0;}
        .product-list-container .product-item .product-price {line-height: 1; padding: 0; font-size: 1.5em; font-weight: 600; letter-spacing:0px;}
        .product-list-container .product-item .product-price + .price-ordinary {margin:.4em 0 0 .5em; padding: 0; line-height: normal; display: block;}
        .product-list-container .product-item .product-price + .price-ordinary .currency {font-size:inherit;}
        .product-list-container .product-item .product-stock {display: flex; flex-direction: row; align-items: center; transition:var(--trans); font-size:.9em;}
        .product-list-container .product-item .product-stock i {display:none;}
        .product-list-container .product-item .product-stock:after {content: attr(title);}
        .product-list-container .product-item .product-stock:before {content:"\f00c"; font:var(--fonticon); font-size:small; color:inherit; margin-right:5px; line-height:inherit;}
        .product-list-container .product-item .product-stock.out_of_stock:before {content:"\f00d";}
        /*.product-list-container .product-item .btn.control-productlist-add-cart-pop {font-size: 0 !important; margin:0; display: flex; align-items: center; align-content: center; height: 4em; width: 4em; padding: 0 !important; border-radius:var(--boradius); justify-content: center; letter-spacing:0;}*/
        .product-list-container .product-item .btn.control-productlist-add-cart-pop {padding:.5em 1em; position:relative; font-size:1em; margin:0; display: flex; flex-direction: row-reverse; align-items: center; align-content: center; border-radius:var(--boradius); justify-content: center;}
        .product-list-container .product-item .btn.control-productlist-add-cart-pop:after {display:none;}
        .product-list-container .product-item .btn.control-productlist-add-cart-pop i {font-size: inherit; margin-left:5px;}
    }
    
    
    
    /*css-preview*/
    #product-view {
        > .row {margin-inline:0;}
        .product-view-header {font-size:.8em; line-height:normal;}
        .product-view-header a {margin:0;}
        .product-view-images {flex: unset; max-width: 40%;}
        .product-view-images > .row {transition:var(--trans); /* position:sticky; position:-webkit-sticky; top:var(--navh);*/}
        .product-view-images > .row > ul.image-container {width:100%; height: 80vh; scroll-snap-type: y mandatory; overflow-y:auto; overflow-x:hidden; border: 1px solid var(--border); border-radius: var(--boradius); display: flex; gap: 1em; background: var(--light); flex-direction: column; flex-wrap: nowrap;}
        .product-view-images > .row > ul.image-container::-webkit-scrollbar {width: 6px; height: 3px; transition:var(--trans);}
        .product-view-images > .row > ul.image-container::-webkit-scrollbar-track {background: transparent;}
        .product-view-images > .row > ul.image-container::-webkit-scrollbar-thumb {background: var(--opac); border-radius:10px; cursor:pointer;}
        .product-view-images > .row > ul.image-container::-webkit-scrollbar-thumb:hover {background: var(--dark);}
        
        .product-view-images ul.image-container :is(li:first-child, li:first-child .image-container) {height:inherit;}
        .product-view-images ul.image-container li:first-child img {object-fit:cover;}
        .product-view-images ul.image-container li {scroll-snap-align: start; margin:0; max-width:100%; background-color:white;}
        .product-view-images ul.image-container li:before {display:none;}
        .product-view-images ul.image-container :is(li, .image-container) {overflow:hidden; height:100%; padding:0;}
        .product-view-images ul.image-container li img {background-color:white; width:100%; height: 100%; object-fit: contain; object-position: center; transition:var(--trans) transform;}
        .product-view-images ul.image-container li:hover img {transform-origin:left; transform:scale(1.2); animation:pan 10s linear infinite;}
        
        .product-view-images + div {flex: unset; max-width: 60%; padding-inline:2em 0;}
        #product_form .product-view-content {
            /*display:flex; flex-direction:column; flex-wrap: nowrap; gap:1em;*/
            display: grid;  grid-template-columns: 1fr 1fr;  grid-template-rows: auto 1fr auto auto auto;  gap: 1em;  grid-template-areas:"c1 c1" "c2 c3" "c4 c4" "c5 c5";
            .title {order:1; grid-area: c1;}
            .title > * {font-size:2em; margin-block:1em .5em;}
            .addition {grid-area: c2;}
            .additions, .product-view-variations, .menu {margin:0; height:100%; font-size:.8em; order:2; float:none !important; padding:1em; border-radius:var(--boradius); border:1px solid var(--border); display: flex; flex-direction: column; gap: .5em;}
            
            .additions, .product-view-variations, .menu {box-shadow:0 0 1.5em rgba(0,0,0,0.08) inset;}
            
            .additions * {float:none !important;}
            .additions ul {border:1px solid var(--border); background-color:white; border-radius:var(--boradius); gap:1em; padding:.75em 1em; margin:0; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; transition:var(--trans);}
            .additions ul:has(#control-addition-check.addition-checked) {background-color:var(--opac);}
            .additions ul li {padding:0 !important; margin:0 !important; line-height:normal;}
            .additions ul li:first-child {margin-right:auto !important; flex:1;}
            .additions ul li:before {display:none;}
            .additions ul li.addition-button #control-addition-check {display: flex; flex-direction: row-reverse; align-items: center; gap: 5px;}
            .additions ul li.addition-button #control-addition-check.addition-unchecked i {display:none;}
            .additions ul li.addition-button #control-addition-check.addition-checked {color:var(--success); font-weight:600;}
            
            .product-view-variations {order:3; grid-area: c3;}
            .product-view-variations .form-group {margin:0; padding:0; position:relative;}
            .product-view-variations .form-group:not(:last-child) {}
            .product-view-variations .form-select:before {display:none;}
            /*version 1*/
            .product-view-variations .form-select > label {display: block; position:absolute; font-size:.9em; letter-spacing:0; inset:.75em auto auto 1.2em; width:calc(100% - 3em); pointer-events:none; display: flex; justify-content: space-between; align-items: flex-end; line-height:normal;} 
            .product-view-variations .form-select > label:after {content:"\f0d7"; font:var(--fonticon); font-size: 1.2em; margin-bottom: -1em;}
            .product-view-variations .form-select > select {appearance: none; -webkit-appearance: none; -moz-appearance: none; padding: 2em 1em .5em 1em; height: unset; }
            /*version 2*/
            /*.product-view-variations .form-select > label {margin:0 0 0 1.5em;} */
            /*.product-view-variations .form-select > select {padding: .5em 1em .5em 1em; height: unset; }*/
            
            
            
            .menu {order:4; grid-area: c4; display: flex; flex-direction: row; flex-wrap: nowrap; padding-inline:1em; margin:0 !important; align-items: flex-end;}
            .menu * {float:none;}
            .menu .product-stock {display:block;}
            .menu > .row {margin:0;}
            .menu > .row > div {padding:0;}
            .menu br {display:none;}
            .menu .price {display:block; letter-spacing:0; font-size:2em; align-items: flex-end; margin-top:5px; line-height:1.2;}
            .menu .price .number {font-size:1.5em; line-height:1;}
            .menu .price .currency {font-size: .8em; line-height: normal; width:2em;}
            .menu > .row:nth-child(1) {width:100%;}
            .menu > .row:nth-child(2) {width:100%;}
            .menu > .row:nth-child(2) > div {flex:unset; max-width:100%;}
            .menu > .row:nth-child(2) .product-buttons {display: flex; flex-direction: row; flex-wrap: nowrap; align-items: stretch;}
            .menu > .row:nth-child(2) .product-buttons input {min-width:6em; height: unset; max-width: unset; border-radius:var(--boradius) 0 0 var(--boradius);}
            .menu > .row:nth-child(2) .product-buttons .btn {margin:0 0 0 -1px; border-radius:0 var(--boradius) var(--boradius) 0; padding: 1em; font-size: 1em; text-wrap: nowrap;}
            
            .description {order:5; grid-area: c5; padding:0;}
        }
    }
    
    
}

@keyframes pan {
    0% {transform-origin:left;}
    50% {transform-origin:right;}
}
html:has(.webshop) .popover {z-index:100; border-radius:var(--boradius); padding:2%;}
html:has(.webshop) .popover .btn {margin-top:0; font-size:.8em; border-radius:var(--boradius);}
html:has(.webshop) .popover .btn:before {display:none;}
html:has(.webshop) .popover .btn:after {content:"\f101"; font:var(--fonticon); margin-left:1em;}
html:has(.webshop) .popover .form-control {box-shadow:none !important; border-color: var(--border) !important;}
#shop-images-modal {inset:0; height:100vh !important; overflow:hidden !important;}
#shop-images-modal .modal-content {height:100%; background:transparent;}
#shop-images-modal .modal-body {height: 100%; background:transparent; border:none;}
#shop-images-modal .modal-dialog {height: 100%; width: 100%; max-height: 100vh; max-width: 100vw; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%) !important; margin: 0;}
#shop-images-modal .modal-dialog img {height: 100%; object-fit: contain; width: 90vw; height: 90vh; object-position: center; margin: 5vh 5vw 5vh 5vw; display: block;}
#shop-images-modal .caption-container {z-index:100; text-align:left; font-size:0; inset:auto 0 -1px 0; display: flex; align-items: flex-start; padding: 2em; background: var(--dark); flex-direction: column; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);}
#shop-images-modal .caption-container h3 {font-size:1.5em !important; margin-bottom:5px;} 
#shop-images-modal .caption-container.hidden {display:none;}
#shop-images-modal .control-close { height: 4em; width: 4em; border-radius:50%;  background-color:var(--dark); color:var(--light) !important; align-items: center; justify-content: center; display: flex; transition:var(--trans);}
#shop-images-modal .control-close:before {transition:.3s all; content: "\f00d"; font: var(--fonticon);}
#shop-images-modal a.controls span:before {transition:.3s all; content: "\f054"; font: var(--fonticon);}
#shop-images-modal a.controls span.glyphicon-chevron-left:before {content: "\f053";}
html:has(body.modal-open), html:has(.webshop) body.modal-open {overflow:hidden auto !important;}
html:has(.webshop) .modal-backdrop:has(+.modal.shop-modal:not(#modal-confirm)) {display:none;}
html:has(.webshop) .modal.shop-modal.show {display: flex !important;}    
html:has(.webshop) .modal.shop-modal.show.load .modal-header:after {animation:maxwidth 8s linear 1 forwards; content: ""; height: 3px; width: 100%; background: var(--opac); position: absolute; inset: auto auto 0 0; transition: var(--trans); max-width: 0px;}
html:has(.webshop) .modal {
    margin:0; align-items: center; transform:none !important; position: fixed; inset: auto auto 2em 0; height: unset; width: unset; background:none !important; -webkit-backdrop-filter:none; backdrop-filter:none;
    .modal-dialog {margin:0; min-width:30em;}
    .modal-content {border-radius:0 var(--boradius) var(--boradius) 0; border-color:var(--border);}
    .modal-header {position:relative; display: flex; flex-direction: row; align-content: center; align-items: center; height:unset;}
    .modal-header:is(:has(> :is(a.close, .btn-close):only-child), :has(> :is(h3:empty, h4:empty, h5:empty))) {display:none;}
    .modal-header :is(a.close,.btn-close) {cursor:pointer; font-size:0; border:1px solid var(--border); color:var(--dark); border-radius:50%; background:rgba(0,0,0,0.1); height:3em; width:3em; display:flex; align-items: center; justify-content: center; opacity:1; float:none; margin:0; transition:var(--trans);}
    .modal-header :is(a.close,.btn-close):hover {opacity:.6;}
    .modal-header :is(a.close,.btn-close):after {content:"\f00d"; font:var(--fonticon); font-size:medium;}
    .modal-header h3 {font-family: var(--font1); line-height:normal; padding-right:1em;}
    .modal-footer {padding-bottom:1em !important; border:none; display: flex; flex-direction: row; justify-content: space-between;}
    .modal-footer .btn {margin:0; border:1px solid var(--border); color:var(--dark) !important; padding:.7em 1.5em !important; border-radius:var(--boradius); font-size:.8em;}
    .modal-footer .btn:before {display:none !important;}
    .modal-footer .btn:after {content:""; font:var(--fonticon); color:inherit;}
    .modal-footer .btn#modal_submit {background:var(--primary);color:var(--light) !important;}
    .modal-footer .btn#modal_dismiss {flex-direction: row-reverse;}
    .modal-footer .btn#modal_dismiss:after {content:"\f060"; margin-inline:0 1em !important;}
    .modal-footer .btn#modal_submit:after {content:"\f061";}
    .modal-body .row {display: flex; flex-direction: row; flex-wrap: nowrap;}
    .modal-body .row img {height:100%; width:100%; border-radius:calc(var(--boradius) / 2);}
    .modal-body .row p br {display:none;}
    .modal-body .row p > strong {font-weight:300;  display: block; padding-bottom: .3em; margin-bottom: .2em;}
    .modal-body .row p > strong a {cursor:default; pointer-events:none; color:inherit;}
    .modal-body .row p > strong ~ i {font-size:.6em !important; font-weight:300;}
    .modal-body .row > div:nth-child(1) {flex: 1 50%; max-width: 50%;}
    .modal-body .row > div:nth-child(2) {margin-block:auto; line-height:1.3; padding-left:0 !important;}
    .modal-body .row > div:nth-child(2) > p {margin-bottom:.5em;}
    .modal-body .row > div:nth-child(2) > p ~ div {font-size:.7em;}
}
/*html:has(.webshop) .modal-backdrop {opacity:1; background-color:rgba(0,0,0,0.3); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);}*/
html:has(.webshop):has(#checkout-toc) .modal.shop-modal {background:rgba(0,0,0,0.2) !important; inset:0; height:100%; width:100%; align-items: center; justify-content: center; max-width:100% !important;}
html:has(.webshop):has(#checkout-toc) .modal.shop-modal .modal-dialog {width:100%;}
html:has(.webshop):has(#shop-checkout) .modal:is(#modal-ajax,#modal-confirm) {inset:50% auto auto 50% !important; transform:translateX(-50%) translateY(-50%) !important;}
html:has(.webshop):has(#shop-checkout) .modal:is(#modal-ajax,#modal-confirm) .modal-content {border-radius:var(--boradius);}
html:has(.webshop):has(#shop-checkout) .modal:is(#modal-ajax,#modal-confirm) .modal-header > :is(h5, h4,h3) {font-size: 2em; font-family:var(--font2);}
/*checkout*/
.webshop #shop-checkout {
    padding-top:3em;
    .btn {border-radius:var(--boradius); margin-top:0;}
    .btn:after {display:none;}
    .btn.keep-shopping {color:var(--dark) !important; flex-direction:row-reverse; background:transparent !important;}
    .btn.keep-shopping:after {content:"\f060"; font:var(--fonticon); color:inherit; margin-inline:0 1em; display:flex;}
    
    .checkout-section-header {margin-block:0; border-bottom:none !important; padding-bottom:0;}
    #checkout-form {display:block; position:relative;}
    
    .checkout-section#checkout-section-top {
        width:100%; margin:0;
        .btn.keep-shopping {float: none; background: transparent; color: var(--dark); padding: 0; margin-top: -3em !important; position: absolute;}
        .checkout-voucher .row > div {flex: unset; max-width: 100%; display: flex; flex-direction: column;}
        .checkout-voucher .row > div .input-group {}
        .checkout-voucher .row > div .input-group input {height:100%; border-radius:var(--boradius) 0 0 var(--boradius);}
        .checkout-voucher .row > div .input-group .btn {border-radius:0 var(--boradius) var(--boradius) 0;}
        .checkout-voucher .row > div .voucher-error {padding-inline:1em;}
        
        > div:nth-child(1) {float:left; width: calc(60% - 2em); padding-top:2em; border-right: 1px solid var(--border); padding-right: 2em;}
        > div:nth-child(1) {display:flex; flex-direction: column;}
        > div:nth-child(1) > .row {order:1;}
        > div:nth-child(1) > #checkout-cart {order:3;}
        > div:nth-child(1) > .checkout-voucher {order:2; margin-top:1em;}
        > :is(div:nth-child(2),div:nth-child(3)) {float:right; width:40%; margin:0;}
        
        #checkout-cart {margin-top:1em;}
        #checkout-cart table {border:none !important; border-radius:0;}
        #checkout-cart table a {margin:0;}
        #checkout-cart table td {padding:0; border:none;}
        #checkout-cart table thead {display:none; background:transparent; border-bottom:1px solid var(--border) !important;}
        #checkout-cart table thead th {color:var(--dark); padding:0; border-bottom:1px solid var(--border) !important; border-top:none !important;}
        #checkout-cart table thead th strong {font-size:.7em; font-weight:600; text-transform:uppercase;}
        #checkout-cart table tbody {line-height:normal;}
        #checkout-cart table tbody tr {border-bottom:1px solid var(--border) !important; padding-block:.5em; position:relative;
            display: grid; 
            grid-template-columns: auto 1fr 10em; 
            grid-template-rows: auto auto; 
            gap: 0; 
            grid-template-areas: 
                "d1 d2 d3"
                "d1 d4 d5";
        }
        #checkout-cart table tbody td {width:unset; padding-block:.5em; }
        #checkout-cart table tbody td:not(:last-child) {}
        #checkout-cart table tbody td:nth-child(1) {grid-area:d1; display: flex; flex-direction: column; justify-content: center; padding-right:1em;}
        #checkout-cart table tbody td:nth-child(2) {grid-area:d2; display: flex; flex-direction: column; justify-content: center; padding-bottom:0;}
        #checkout-cart table tbody td:nth-child(3) {grid-area:d3; padding-bottom:0;}
        #checkout-cart table tbody td:nth-child(4) {grid-area:d4; padding-top:0;}
        #checkout-cart table tbody td:nth-child(5) {grid-area:d5; padding-top:0;}
        #checkout-cart table tbody td:nth-child(6) {grid-area:d6; position:absolute; left:0; top:0;}
        
        #checkout-cart table tbody :is(td:nth-child(3),td:nth-child(5)) {text-align:center;}
        #checkout-cart table tbody :is(td:nth-child(2),td:nth-child(4)) {}
        
        #checkout-cart table tbody td:nth-child(1) img {border:1px solid var(--border); height:8em !important; width:8em !important; object-fit:cover; border-radius:calc(var(--boradius));}
        #checkout-cart table tbody td:nth-child(2) strong {font-weight:400; font-size:1em;} 
        #checkout-cart table tbody td:nth-child(2) > strong:first-child + .property {margin-top:.5em;}
        #checkout-cart table tbody td:nth-child(2) > strong:first-child ~ .property:last-child {margin-bottom:.5em;}
        #checkout-cart table tbody td:nth-child(2) .property {display:inline-flex; margin-block:-1px;}
        #checkout-cart table tbody td:nth-child(4) {font-weight:700; font-size:1.1em; letter-spacing:0px;} 
        #checkout-cart table tbody td:nth-child(4) span:nth-child(2) {font-weight:400; font-size:.8em; letter-spacing:0px;}
        
        #checkout-cart table tbody td:nth-child(3) {display: inline-flex; justify-content: center; align-items: flex-end;}
        #checkout-cart table tbody td:nth-child(3) > * {background: transparent; font-size:1em; margin:0 !important; color: var(--dark) !important; height: 3em; width: 3em; display: inline-flex; padding: 0; align-items: center; justify-content: center;}
        #checkout-cart table tbody td:nth-child(3) > .btn {font-size:.7em !important; border: 1px solid var(--border); border-radius: 50%; margin-bottom:.7em !important;}
        
        #checkout-cart table tbody td:nth-child(5) {font-weight: 700; letter-spacing: 0px; font-size: 1.5em;}
        #checkout-cart table tbody td:nth-child(6) > .btn {opacity:0; background: var(--danger); width: 3em; height: 3em; padding: 0; display: flex; align-items: center; justify-content: center;}
        #checkout-cart table tbody tr:hover td:nth-child(6) > .btn {opacity:1;}
        
        #checkout-cart table tbody tr:not(tr[id]):has(+tr[id]) {border-bottom:none !important; padding-bottom:0;}
        #checkout-cart table tbody tr[id]:has(+tr:not([id])) {/*padding-bottom:1em;*/}
        #checkout-cart table tbody tr[id] {display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; padding-block:0; padding-bottom:.5em; border-bottom:1px solid var(--border);}
        #checkout-cart table tbody tr[id] :is(td:nth-child(1),td:nth-child(3),td:nth-child(4),td:nth-child(6)) {display:none;}
        #checkout-cart table tbody tr[id] td:nth-child(2) {display: flex; flex-direction: row; padding:0;}
        #checkout-cart table tbody tr[id] td:nth-child(5) {width:10em; padding:0; font-size:1em; color:var(--danger); font-weight:300;}
        #checkout-cart table tbody :is(tr[id]+tr[id]) {display:none;}
        
        #checkout-cart table tbody tr:has(+tr.addition) {border-bottom:none !important;}
        
        #checkout-cart table tbody tr:last-child {background:var(--opac); border-radius:0 0 var(--boradius) var(--boradius);}
        #checkout-cart table tbody tr:last-child td:nth-child(1) {display:none;}
        #checkout-cart table tbody tr:last-child td:nth-child(4) {text-align:right;}
        #checkout-cart table tbody tr:last-child td:nth-child(4) strong {font-weight:300; line-height: 2; display: block;}
    }
    
    
    .checkout-section:has(+.checkout-section:empty):after {content:""; display:block; clear:both;}
    .checkout-section {
        width: 40%; margin-left: auto;
        #control-checkout-open-login {border-bottom:1px dashed var(--dark);}
        .checkout-section-inner:nth-child(2) {
            padding-bottom:0 !important; margin-top:2em !important;
            .row > .col-md-6:has(+.col-md-6):nth-child(1) {padding-right:.4em;}
            .row > .col-md-6+.col-md-6:nth-child(2) {padding-left:.4em;}
            .form-group label {margin-bottom:0;}
            .form-group input {height:3em;}
        }
        .checkout-section-inner:nth-child(2)+.checkout-section-control {margin:0 !important; border:1px solid var(--border); border-top:none !important; padding:0 2em 2em 2em; border-radius:0 0 var(--boradius) var(--boradius);}
        .checkout-section-inner:nth-child(2)+.checkout-section-control > div {padding-inline:0;}
        .checkout-section-inner:nth-child(2)+.checkout-section-control .btn {width:100%; display: flex; justify-content: space-between;}
        .checkout-section-inner .form-group {margin-bottom:.8em;}
        .checkout-section-inner .checkout-option {display:flex; align-items: center; flex-direction: row; justify-content: flex-start; gap:1em; border-radius:var(--boradius); margin-bottom:.8em;}
        .checkout-section-inner .checkout-option .checkout-option-logo {padding: 0 0px 0 10px; display: flex; align-items: center; justify-content: center;}
        .checkout-section-inner .checkout-option .checkout-price {margin-left:auto;}
        .checkout-section-inner .checkout-option.selected {background:var(--opac) !important;}
        
    }
    
    
    .checkout-section#checkout-section-top {
        .checkout-section-inner:nth-child(2) .row {margin:0 !important; border:1px solid var(--border); border-bottom:none !important; padding:1em 1em 0 1em; border-radius:var(--boradius) var(--boradius) 0 0;}
        ~ .checkout-section {transform: translateY(3em); margin-top:3em; display: flex; flex-direction: column;}
        ~ .checkout-section .checkout-section-inner {margin:1em 0 0 0 !important; border:1px solid var(--border); border-bottom:none; padding:2em 2em 0 2em; border-radius:var(--boradius) var(--boradius) 0 0;}
    }
    
    .checkout-section#checkout-section-final .checkout-section-inner {
        border-bottom:1px solid var(--border) !important; overflow:hidden; border-bottom-left-radius:var(--boradius) !important; border-bottom-right-radius:var(--boradius) !important;
        h4 {margin-block:0 .5em;}
        textarea {height:120px;}
        .form-group:has(.form-group) {margin-bottom:0;}
        :is(input[type=checkbox], input[type=radio]) {height:1.5em !important; width:1.5em !important; accent-color:var(--primary); margin-right:.5em; cursor:pointer;}
        div:has(>:is(input[type=checkbox], input[type=radio])) {display: flex; align-content: center; align-items: center; flex-direction: row; flex-wrap: wrap;}
        .checkout-shipping-info-container {border-top:1px solid var(--border); margin-top:2em;}
        .checkout-shipping-info-container h2 {margin-bottom:.5em; padding-right: 50%; font-size: 2em;}
        .checkout-shipping-info-container h2 small {position: absolute; right: 0;}
        .checkout-shipping-info-container h2 small button {font-family:var(--font1); background: transparent !important; outline:none !important; color:var(--dark) !important; box-shadow:none !important; padding: 0; border:none !important; border-bottom: 1px dashed !important; border-radius: 0;}
        .checkout-shipping-info-container + .row {
            background: var(--opac); margin: 2em -2em 0 -2em !important; padding:2em;
            .checkout-shipping-info-container + .row > div:has(.checkout-error-msg:empty) {display:none;}
            hr {margin-top:0;}
            #checkout-sum {padding: 1em 0; line-height: normal; font-size: 1em; text-align: left;}
            #checkout-sum span {font-weight:700; font-size:1.3em;}
            #checkout-toc {margin-top:1em; line-height:normal; text-align:left;}
            #checkout-toc #control-open-toc {border: 1px solid var(--border); margin-inline: 5px; border-radius: var(--boradius); padding: .1em 1em; background: var(--primary); color: var(--light);}
            #input_checkout_submit {width:100%; display:flex; margin-top:1em; justify-content: space-between;}
            #input_checkout_submit:after {display:flex;content:"\f00c"; font:var(--fonticon); color:inherit; margin-left:1em;}
            #input_checkout_submit i {margin-left:auto;}
            #input_checkout_submit:has(i):after {display:none;}
        }
    }
    
    
    
    #checkout-receipt {
        a {margin:0;}
        hr {display:none;}
        table {border-radius:0;}
        table thead {background:var(--opac) !important; color:var(--dark) !important;}
        table tbody {font-size:1em;} 
        table strong {line-height: normal; display: inline-block;}
        table tr {background:transparent !important;}
        table td {border:none; border-bottom:1px solid var(--border); padding-block:.2em; vertical-align:top; padding-inline:0;}
        table .form-group, table .form-group label {margin:0;}
        table .form-group label {line-height: normal; display: block; margin-top: .5em;}
        table td[valign="top"] table tbody td:first-child {padding-left: 0 !important;}
        table td[valign="top"] > .row {display: flex; flex-direction: column;}
        table:not(.table) > tbody > tr > td > strong {font-size:1.2em;}
        table td img {width: 5em; max-height: 5em !important; object-fit: contain;}
        table thead tr th {padding-inline:0 !important;}
    }
}
 

@keyframes maxwidth {
    100% {max-width:100%;}
}
/*html:has(.webshop):has(.modal.shop-modal.show) .popover:has(.pop-product-price).show {opacity:0;}*/

@media (max-width: 2060px) {
    .webshop {font-size: 18px;} 
}
@media (max-width: 1920px) {
    .webshop {font-size: 16px;}
    .webshop .shop-container .shop-main #product-list[data-view="0"] .product-list-container {grid-template-columns: 1fr 1fr 1fr;}
}
@media (max-width: 1440px) {
    .webshop {font-size: 14px;} 
}
@media (max-width: 1280px) {
    :root {
        --boradius: 12px; 
    }
    
    .webshop {font-size: 12px;} 
    .webshop .shop-container .shop-main #product-list[data-view="0"] .product-list-container {grid-template-columns: 1fr 1fr;}
}
@media (max-width: 992px) {
    
    .webshop {padding-inline:7.5px;}
    
    .webshop .shop-container .shop-menu {
        max-width:calc(100vw - 2.5em); position: absolute; z-index: 100; background: #fff;
        .shop-menu-title {font-size:1em !important; transition:var(--trans);}
        .shop-menu-toggler {display:flex; font-size:medium !important;}
    }
    
    
    .webshop .shop-container .shop-menu.collapsed {max-height:5em; max-width:12em; padding-left:0; padding-block:0;} 
    .webshop .shop-container .shop-menu.collapsed .shop-menu-title .shop-menu-toggler {border-bottom-left-radius:0; border-top-left-radius:0; border-left-color:var(--opac); border-top-color:var(--opac); border-bottom-color:var(--opac);}
    .webshop .shop-container .shop-menu.collapsed .shop-menu-list {opacity:0; max-height:0px; margin:0;}
    
    
    .webshop:has(.shop-main #shop-search-field.open) .shop-container .shop-menu.collapsed {max-width: 3em; padding-right: 0 !important;}
    .webshop:has(.shop-main #shop-search-field.open) .shop-container .shop-menu.collapsed .shop-menu-title {font-size:0px !important; letter-spacing:0;}
    .webshop:has(.shop-main #shop-search-field.open) .shop-container .shop-menu.collapsed .shop-menu-title .shop-menu-toggler {border-right-color:var(--opac); border-radius:0;}
        
    .webshop .shop-container .shop-main:has(.cart-dropdown.show):not(:has(.dropdown-menu > .text-center)) {z-index:100 !important;}
    html:has(.webshop .shop-container .shop-main .cart-dropdown.show):not(:has(.dropdown-menu > .text-center)) #cc-settings-container {z-index:-1;}
    .webshop .shop-container:has(.shop-main .cart-dropdown.show):not(:has(.dropdown-menu > .text-center)) .shop-menu {opacity:0;}
    .webshop .shop-container .shop-main {
        position:relative; z-index:1;
        #shop-menu-top .topnav-menu-left {flex:1 20%; font-size:0;}
        #shop-menu-top .topnav-menu-right li.topmenu-cart {
            #shop-cart .dropdown-menu {min-width:50vw; width:calc(100vw - 2.5em) !important;}
            #shop-cart .dropdown-menu:has( > .text-center) {min-width:15em; width:15em !important;}
            /*cart-fixed*/
            #shop-cart .dropdown-menu {width:101vw !important; max-height:calc(100vh - var(--navh) - 1.8em) !important; border-radius:var(--boradius) var(--boradius) 0 0 !important;}
        }
        #shop-menu-top .topnav-menu-right li.topmenu-search #shop-search-results {margin: 0 -5.5em 0 0; max-width: calc(90vw + 1em); border-radius:var(--boradius);}
        #shop-menu-top .topnav-menu-right li.topmenu-search #shop-search-results.show.open:empty {margin:0 !important;}
        #shop-cart .dropdown-menu:not(:has(> .text-center)) > a.close {font-size:1.5em !important; left: auto !important; right: 0 !important; transform: scale(-1, 1);}
    }
    
    
    html:has(.webshop) .tooltip {display:none;}
    
    html:has(.webshop) .modal.shop-modal {inset:auto -1px -1px -1px;}
    html:has(.webshop) .modal.shop-modal .modal-content {border-radius:var(--boradius) var(--boradius) 0 0;}
    
    
    .webshop #shop-checkout .checkout-section#checkout-section-top > div:nth-child(1) {border:none !important; padding-right:0 !important;}
    .webshop #shop-checkout .checkout-section#checkout-section-top ~ .checkout-section:empty {display:none;}
    .webshop #shop-checkout .checkout-section, .webshop #shop-checkout .checkout-section#checkout-section-top > div {float: none !important; width: 100% !important; padding-top: 0 !important; margin-inline:0 !important;}
    .webshop #shop-checkout .checkout-section#checkout-section-top #checkout-cart table tbody tr td:nth-child(6) > .btn {opacity:.3;}
    .webshop #shop-checkout .checkout-section#checkout-section-top .checkout-section-inner:nth-child(2) .row {padding-inline:0 !important;}
    .webshop #shop-checkout .checkout-section#checkout-section-top ~ .checkout-section {transform:none !important;}
    .webshop #shop-checkout .checkout-section .checkout-section-inner:nth-child(2) .row > .col-md-6,
        .webshop #shop-checkout .checkout-section#checkout-section-top ~ .checkout-section .checkout-section-inner,
        .webshop #shop-checkout .checkout-section .checkout-section-inner:nth-child(2)+.checkout-section-control {padding-inline:15px !important;}
    .webshop #shop-checkout .checkout-section .checkout-section-inner .checkout-option {min-height:3em;}
    .webshop #shop-checkout .checkout-section .checkout-section-inner .checkout-option .checkout-option-logo img {max-height:2em;}
    
    html:has(.webshop):has(#shop-checkout) .modal:is(#modal-ajax,#modal-confirm) .modal-dialog {min-width:60vw; width:90vw !important;}
    
    /*.webshop  #checkout-receipt table {overflow-x:auto; display:block;}*/
    /*.webshop  #checkout-receipt :is(table:not(.table) > tbody) {display:block;}*/
    /*.webshop  #checkout-receipt :is(.table-responsive table) {width:150vw !important;}*/
    
    
    
    .webshop .shop-container .shop-main #product-view {
        > .row {flex-direction: column; flex-wrap: nowrap;}
        .product-view-images, .product-view-images + div {max-width:100%;}
        .product-view-images + div {padding-inline:0;}
        .product-view-images > .row > ul.image-container {height:40vh;}
        #product_form .product-view-content {grid-template-columns:1fr; grid-template-areas: "c1" "c2" "c3" "c4" "c5";}
    }
}

@media (max-width:767px) {
    .webshop .shop-container .shop-main #product-list[data-view="1"] {
        .product-list-container .product-item > .row {grid-template-columns: 20% 1.5fr 0.5fr;}
        .product-list-container .product-item .btn.control-productlist-add-cart-pop {font-size:0; letter-spacing:0; width:36px; height:36px;}
        .product-list-container .product-item .btn.control-productlist-add-cart-pop i {font-size:12px; margin:0;}
    }
    
    
}

/*******WEBSHOP-V3********/



.div-products .__col:nth-child .home-product {background: #ffffff !important;}



.home-product {box-shadow: 0 14px 28px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.10); text-align: center; padding-bottom:10px !important; transition:.3s all;}
.div-products .__col:nth-child .home-product {box-shadow: 0 14px 28px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.10); background: #ffffff !important;}

.home-product .block-image {padding: 10px 10px 0 10px;}
.home-product img {width:100%; margin-top:0 !important; transition:.3s all; background: #ffffff;     height: auto; object-fit: cover;}
.home-product:hover img {transform:scaleX(-1);}

.home-product p a {color: #17141b; background-color: #e2e6ea; border-color: #dae0e5; border-radius: 23px; padding: 10px 35px !important; font-size: .6rem; letter-spacing: 2px; text-transform: uppercase;}
.home-product p a:hover {background-color: #333; color: #17141b !important;}

.home-product .block-text {padding: 0 15px; color:#17141b; position: absolute; top: 0; background: #ffffff;  box-shadow: 0 14px 28px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.10); left: 0; width: 100%; margin: 0; height: 100%; display: flex; justify-content: center; align-content: center; opacity:0; transition:.3s all;}
.home-product .block-text p {margin-top: 0!important; font-size: 12px;}
.home-product:hover .block-text {opacity:1;}
.home-product .block-header {position: absolute; background: #e1f3fe; left: 50%; transform: translateX(-50%); margin-top: -70px; height: 70px; width: 80%; padding: 0 !important; border-radius: 10px 10px 0 0; display: flex;  align-content: center; margin-left: auto; margin-right: auto; transition:.3s all;}
.home-product .block-header h5 {padding:10px; line-height:normal; margin-top:0px !important; font-size:1rem; }
.home-product:hover .block-header {opacity:0;}
.home-product:hover {transform:translateY(-10px); box-shadow: 0 14px 28px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.10);}


.__base .home-product .block-text{position:relative !important;}

.__base .home-product .block-header {opacity: 1 !important;}


.reco-review {}
.reco-review img {width:100px;}
.reco-review .block-text p {font-style: italic;}
.reco-review .block-text p:before, .reco-review .block-text p:after {content:"\"";}
.reco-review .block-header h6 {margin-top:10px;}
.reco-review .block-header h6 > small {float: right;     margin-top: 1px;}

.link {cursor: pointer !important;}
.product-category .block-columns {justify-content:center;}
.product-category .__col {max-width: calc(100% / 7); padding:6px;}
.product-category .__col .block-section {padding:0 !important;}
.product-category .__col .home-product:hover {transform:none; box-shadow:none;}
.product-category .__col .home-product .block-image {padding:0;}
.product-category .__col .home-product .block-image img {filter:saturate(0); height: 150px; object-fit: contain;}
.product-category .__col .home-product:hover .block-image img {filter:saturate(1);}
.product-category .__col .home-product .block-header {height: auto; bottom: 0; box-shadow:0 -1px 2px rgba(0,0,0,0.4);}
.product-category .__col .home-product .block-header * { font-family:"Roboto", sans-serif !important; font-weight:400; line-height:normal; padding:3px; word-break: break-word; font-size:.9rem;}
.product-category .__col .home-product p a.btn {margin-top:0 !important;}

footer .cards {display:flex; gap:1rem; justify-content: center; margin-inline:auto; width:70%;}
footer .cards img {overflow:hidden;}