@import url("https://fast.fonts.com/t/1.css?apiType=css&projectid=5944f6fd-00d7-4d13-9542-be04003cb26d");

@font-face {
    font-family: "GothicMT";
    src: url("font_Fonts/1dd2c283-40a4-490b-a0d7-ef417dac4d66.eot?#iefix");
    src: url("font_Fonts/1dd2c283-40a4-490b-a0d7-ef417dac4d66.eot?#iefix") format("eot"), url("font_Fonts/7100c084-fc4c-46d8-b4e5-ddddc8a5ef96.woff") format("woff"), url("font_Fonts/8abe9396-51db-4d9e-a3e2-71f057051ec6.ttf") format("truetype"), url("font_Fonts/9937da80-c9ad-405a-b7ad-ed7552fbc86a.svg#9937da80-c9ad-405a-b7ad-ed7552fbc86a") format("svg");
    font-weight: bold;
}
@font-face {
    font-family: "GothicMT";
    src: url("font_Fonts/a71dcf3d-91d5-4b67-ad95-ba45e25b28f5.eot?#iefix");
    src: url("font_Fonts/a71dcf3d-91d5-4b67-ad95-ba45e25b28f5.eot?#iefix") format("eot"), url("font_Fonts/d664aa3b-f4dc-406d-b408-2a5ee084baaa.woff") format("woff"), url("font_Fonts/a1fc2674-ef44-4d2e-9d4b-09a91300605c.ttf") format("truetype"), url("font_Fonts/b3a4469c-29b6-4c2e-94dc-839a00dccec6.svg#b3a4469c-29b6-4c2e-94dc-839a00dccec6") format("svg");
    font-weight: bold;
    font-style: italic;
}
@font-face {
    font-family: "GothicMT";
    src: url("font_Fonts/40243557-c5f5-4171-8307-6e27b16a7903.eot?#iefix");
    src: url("font_Fonts/40243557-c5f5-4171-8307-6e27b16a7903.eot?#iefix") format("eot"), url("font_Fonts/e7f852ae-faae-439e-8f52-357252dca129.woff") format("woff"), url("font_Fonts/a5ba7c6f-70f7-4464-846a-63f92185389d.ttf") format("truetype"), url("font_Fonts/834ad741-1578-4b46-9d25-347cf313964f.svg#834ad741-1578-4b46-9d25-347cf313964f") format("svg");
    font-style: italic;
}
@font-face {
    font-family: "GothicMT";
    src: url("font_Fonts/37d9e911-0350-4505-a092-d4bb68731be9.eot?#iefix");
    src: url("font_Fonts/37d9e911-0350-4505-a092-d4bb68731be9.eot?#iefix") format("eot"), url("font_Fonts/df9b49fd-a69d-4b3c-9502-e148796c36ba.woff") format("woff"), url("font_Fonts/2547c32b-e98b-487e-b645-8f51db8ae92f.ttf") format("truetype"), url("font_Fonts/a5f40cdb-c908-4500-81c7-a7e69f01df8c.svg#a5f40cdb-c908-4500-81c7-a7e69f01df8c") format("svg");
}
@font-face {
    font-family: "Eurostile";
    src: url("font_Fonts/244cc320-7c47-4dde-840a-6845ccd3f1d7.eot?#iefix");
    src: url("font_Fonts/244cc320-7c47-4dde-840a-6845ccd3f1d7.eot?#iefix") format("eot"), url("font_Fonts/9ae65e56-1c19-4809-aeca-85a714dba123.woff") format("woff"), url("font_Fonts/bf618234-ac48-4307-a221-479efb8abb91.ttf") format("truetype"), url("font_Fonts/5feaa7be-4241-4568-9ef4-c8dbe36a4364.svg#5feaa7be-4241-4568-9ef4-c8dbe36a4364") format("svg");
}

/* BOOTSTRAP OVERRIDE */

table * {
    box-sizing: unset
}

tbody, td, tfoot, th, thead, tr {
     border-color: inherit; 
     border-style: inherit; 
     border-width: inherit; 
}

#all .row>* {
    flex-shrink: inherit;
    width: inherit;
    max-width: inherit;
    padding-left: inherit;
    padding-right: inherit;
    margin-top: inherit;
}

#all .row {
    display: inherit;
    flex: inherit;
    flex-wrap: inherit;
    margin-top: inherit;
    margin-right: inherit;
    margin-left: inherit;
}

.progress {
    display: inherit;
    height: inherit;
    overflow: inherit;
    font-size: inherit;
    background-color: inherit;
    border-radius: inherit;
}

.navbar {
    padding-top: 0;
    padding-bottom: 0;
}

table {
    caption-side: inherit;
    border-collapse: inherit;
}

caption {
    padding-top: inherit;
    padding-bottom: inherit;
    color: inherit;
    text-align: inherit;
}

dd {
    margin-bottom: inherit;
    margin-left: 40px;
}

.dropdown-menu {
    margin: 0;
}

.btn {
    color: var(--v-primary-text, #212121);
}

.btn:hover {
    color: var(--v-primary-text-highlight);
}

.btn.btn-primary, .btn.btn-primary:hover {
    color: #FFF;
    border-radius: 0;
}

/* BOOTSTRAP OVERRIDE END */

/* Custom Properties declaration */
/* Color Palette */
:root {
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #007bff;
    --secondary: #6c757d;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --lighter: #fafafa;
    --dark: #343a40;
    --darker: #121212;
    --vsl-darkblue: #00233c;
    --vsl-darkgrey: #374350;
    --vsl-green: #1bb50b;
    --vsl-midgreen: #127f03;
    --vsl-grey: #657280;
    --vsl-light-grey: #c0cad4;
    --vsl-midblue: #417695;
    --vsl-orange: #e64505;
    --vsl-midprocessblue: #54b4ff;
    --vsl-processblue: #0086cd;
    --vsl-main-grey1: #090909;
    --vsl-main-grey2: #1c1e21;
    --vsl-cream1: #e5e5e5;
    --vsl-cream2: #f0f0f0;
    --vsl-darker-blue: #04050A;
    --vsl-secundary-grey: #bdbdbd;
    --vsl-secundary-grey-highlight: #e0e0e0;
    --vsl-border-grey: #616161;
    --nav-font: 'GothicMT';
    --nav-font-size: 0px;
    --oacc-invert: 0.0;
    --vsl-spinner-bgimage: url("jquery-ui-1.13.1/images/ui-icons_777777_256x240.png");
}

:root[data-theme='dark'] {   
    --v-bgd-color: var(--darker, #121212);
    --v-breadcrumb-color: var(--vsl-main-grey2, #1c1e21);
    --v-highlight-red: var(--red, #dc3545);
    --v-hr-color: var(--light, #f8f9fa);
    --v-link-active-color: var(--vsl-midblue, #417695);
    --v-link-color: var(--vsl-midprocessblue, #54b4ff);
    --v-primary-text: var(--vsl-lighter, #fafafa);
    --v-primary-text-highlight: var(--vsl-midblue, #417695);
    --v-secundary-border: var(--vsl-border-grey, #616161);
    --v-secundary-text-highlight: var(--vsl-secundary-grey-highlight, #e0e0e0);
    --v-secundary-text: var(--vsl-secundary-grey, #bdbdbd);
    --v-text-inverted: var(--darker, #121212);
    --v-footer-bgd-color: var(--vsl-main-grey2, #1c1e21);
    --v-content-bgd-color: var(--vsl-main-grey2, #1c1e21);
    --v-navbar-bgd-color: var(--vsl-darkblue, #00233c);
    --v-navbar-color: var(--light, #f8f9fa);
    --v-nav-frag-color: var(--vsl-main-grey1, #090909);
    --v-nav-frag-color-highlight: var(--vsl-main-grey2, #1c1e21);
    --v-pricebox-bgd-color: var(--vsl-main-grey2, #1c1e21);
    --v-pricebox-color: var(--vsl-cream1, #e5e5e5);
    --v-embnav-color: var(--vsl-cream1, #e5e5e5);
    --v-icon-brightness: 0.9;
    --v-icon-brightness-hover: 0.6;
    --v-table-row-highlight: var(--darker, #121212);
    --v-music-top-bgd: var(--vsl-darker-blue, #04050A);
    --v-navbar-border-color: var(--vsl-midblue, #417695);
    --v-forum-primary-bgd: var(--vsl-main-grey2, #1c1e21);
    --v-scroll-bgd: #393939;
    --v-scroll-color: #606060;
    --v-scroll-border: #595959;
    --v-scroll-highlight: #868686;
    --oacc-invert: 1.0;
    --vsl-spinner-bgimage: url("jquery-ui-1.13.1/images/ui-icons_ffffff_256x240.png");
    --v-disabled-bgd: var(--vsl-grey, #657280);
}

:root[data-theme='light'] {
    --v-bgd-color: var(--lighter, #fafafa);
    --v-breadcrumb-color: var(--vsl-cream1, #e5e5e5);
    --v-highlight-red: red;
    --v-hr-color: var(--dark, #343a40);
    --v-link-active-color: var(--vsl-midblue, #417695);
    --v-link-color: var(--vsl-processblue, #0086cd);
    --v-primary-text: #212121;
    --v-secundary-border: var(--vsl-border-grey, #616161);
    --v-secundary-text-highlight: #929292;
    --v-secundary-text: #424242;
    --v-text-inverted: var(--lighter, #fafafa);
    --v-footer-bgd-color: var(--vsl-cream1, #e5e5e5);
    --v-content-bgd-color: var(--vsl-cream2, #f0f0f0);
    --v-navbar-bgd-color: var(--vsl-darkblue, #00233c);
    --v-navbar-color: var(--light, #f8f9fa);
    --v-nav-frag-color: var(--vsl-cream1, #e5e5e5);
    --v-nav-frag-color-highlight: var(--vsl-cream2, #f0f0f0);
    --v-pricebox-bgd-color: var(--vsl-cream2, #f0f0f0);
    --v-pricebox-color: var(--vsl-main-grey2, #1c1e21);
    --v-embnav-color: var(--vsl-cream1, #e5e5e5);
    --v-icon-brightness: 0.2;
    --v-icon-brightness-hover: 0.4;
    --v-table-row-highlight: var(--vsl-cream1, #e5e5e5);
    --v-music-top-bgd: var(--vsl-cream1, #e5e5e5);
    --v-navbar-border-color: var(--vsl-midblue, #417695);
    --v-forum-primary-bgd: var(--vsl-cream2, #f0f0f0);
    --v-scroll-bgd: #e0e0e0;
    --v-scroll-color: #909090;
    --v-scroll-border: #c0c0c0;
    --v-scroll-highlight: #868686;
    --oacc-invert: 0.0;
    --vsl-spinner-bgimage: url("jquery-ui-1.13.1/images/ui-icons_777777_256x240.png");
    --v-disabled-bgd: var(--vsl-main-grey2, #1c1e21);
}

.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1135px;
}

:root {
    --font-family-sans-serif: GothicMT, Arial, Helvetica, Verdana, sans-serif;
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --vsl-nav-height: 70px;
    --vsl-shadow: 0;
}

/* HEADER stuff for cms compatibility */
header>nav>div {
    height: 100%;
    margin: 0;
    padding: 0;
    display: inline-flex;
}

header>nav>div>div {
    display: flex;
    height: 100%;
    margin: 0;
    padding: 0;
}

/* Fix for new structure */
header>nav>div>ul { 
    margin-top: 0;
}
body{
  padding-top: calc(var(--vsl-nav-height) + 15px);
}
#all>.span6>#fragment {
    background-color: var(--v-content-bgd-color, #f0f0f0);
    width: 100%;
}

#frag252.span6 {
    float: right;
}

.span2.sidegap>div>div.vsl-footer-social {
    display: none;
}

/* CUSTOM SCROLLBARS */
body,
.fancybox-inner,
#playlist.myplayer ul.audio,
.cscrollbar {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: var(--v-scroll-color, #909090) var(--v-scroll-bgd, #e0e0e0);
    scrollbar-width: thin;
}
body::-webkit-scrollbar,
.fancybox-inner::-webkit-scrollbar,
#playlist.myplayer ul.audio::-webkit-scrollbar,
.cscrollbar::-webkit-scrollbar {
    height: 10px;
    width: 12px;
    background-color: var(--v-scroll-bgd, #e0e0e0);
}
body::-webkit-scrollbar-corner,
.fancybox-inner::-webkit-scrollbar-corner,
#playlist.myplayer ul.audio::-webkit-scrollbar-corner,
.cscrollbar::-webkit-scrollbar-corner {
    background: var(--v-scroll-color, #909090);
}
body::-webkit-scrollbar-thumb,
.fancybox-inner::-webkit-scrollbar-thumb,
#playlist.myplayer ul.audio::-webkit-scrollbar-thumb,
.cscrollbar::-webkit-scrollbar-thumb {
    background: var(--v-scroll-color, #909090);
    border: 1px solid var(--v-scroll-border, #c0c0c0);
}
body::-webkit-scrollbar-thumb:hover,
.fancybox-inner::-webkit-scrollbar-thumb:hover,
#playlist.myplayer ul.audio::-webkit-scrollbar-thumb:hover,
.cscrollbar::-webkit-scrollbar-thumb:hover {
    background: var(--v-scroll-highlight, #868686);
}
body::-webkit-scrollbar-track,
.fancybox-inner::-webkit-scrollbar-track,
#playlist.myplayer ul.audio::-webkit-scrollbar-track,
.cscrollbar::-webkit-scrollbar-track {
    border: 1px solid var(--v-scroll-bgd, #e0e0e0);
    background-color: var(--v-scroll-bgd, #e0e0e0);
}


#extplayer .pane {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: #606060 #393939;
    scrollbar-width: thin;
}
#extplayer .pane::-webkit-scrollbar {
    height: 10px;
    width: 12px;
    background-color: #393939;
}
#extplayer .pane::-webkit-scrollbar-corner {
    background: #606060;
}
#extplayer .pane::-webkit-scrollbar-thumb {
    background: #606060;
    border: 1px solid #595959;
}
#extplayer .pane::-webkit-scrollbar-thumb:hover {
    background: #868686;
}
#extplayer .pane::-webkit-scrollbar-track {
    border: 1px solid #393939;
    background-color: #393939;
}

.vsl-acryl-blue {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  background-blend-mode: exclusion;
  background: #00233CE0;
  background-image: url('./svg/noise.png');
}
.vsl-bg-dark {
  background-color: #00233c;
}
.vsl-text-light {
  color: #fff !important;
}

/* MEGAMENU */
.dropdown .dropdown-menu {
    display: block;
    max-height: 0px;
    transition: max-height 0.45s ease-out;
    overflow: hidden;
}
.dropdown:hover .dropdown-menu {
    display: block;
    max-height: 1000px;
    transition: max-height 0.3s ease-in;
    z-index: 1100;
}
.megamenu {
    position: static;
}
.vsl-mm-container>* {
    font-size: 14px;
}
.megamenu .dropdown-menu {
  border: none;
  border-radius: 0;
  width: 100%;
  left: 0;
  right: 0;
}
.container-fluid {
	margin: 0;
	padding: 0;
}
.container-fluid .row {
	margin: 0;
	padding: 0;
}
.vsl-mm-container {
  max-width: 1050px;
  margin-left: auto;
  margin-right: auto;
}
.megamenu .row li {
    float: inherit;
    padding-left: 0;
}
header .dropdown-menu {
    border: 0;
    right: 0;
    left: auto;
}

li#usermenu {
    background: url(./svg/w-person-circle.svg) no-repeat center;
    background-size: 20px;
    margin-left: 7px;
    margin-right: 10px;
}

li#nav_basket {
    background: url(./svg/w-basket3.svg) no-repeat center;
    background-size: 19px;
    margin-left: 7px;
    margin-right: 7px;
}

li#nav_basket.full {
    background: url(./svg/w-basket3-fill.svg) no-repeat center;
    background-size: 19px;
}

li#nav_basket:hover>a.nav-link {
    background: radial-gradient(circle at center, #ffffffaa 0%, #ffffff00 45%);
}

li#usermenu:hover>a.nav-link {
    background: radial-gradient(circle at center, #ffffffaa 0%, #ffffff00 45%);
}
a#dml.logedin::after {
    width: 6px;
    height: 6px;
    content: " ";
    background: var(--vsl-green);
    border-radius: 50%;
    top: 10px;
    left: 11px;
    position: relative;
}

/* BASKET */
#box_basket {
    min-width: 350px;
    font-size: 0.9em;
}
#box_basket table {
    width: 100%;
}
#box_basket table * {
    box-sizing: content-box;
}
#box_basket table .price{
    width: 90px;
    text-align: end;
    padding-right: 15px;
}
#box_basket tr {
    white-space: nowrap;
}
#box_basket>div {
    margin-top: 18px;
    margin-bottom: 18px;
}
#box_basket .headline,
#box_basket .basketlist,
#box_basket .sum,
#box_basket .gotobasket {
    margin-left: 10px;
    margin-right: 10px;
    min-height: 20px;
}
#box_basket .gotobasket a {
    color: #fff;
    float: right;
    padding: 5px;
}
#box_basket .gotobasket a:hover {
    color: #1e2125 !important;
    background-color: #f8f9fa !important;
}
#box_basket .gotobasket a::before {
    height: 15px;
    width: 15px;
    margin-right: 6px;
    vertical-align: middle;
    content: url("./svg/w-arrow-right-square-fill.svg");
}

#box_basket .gotobasket a:hover::before {
    cursor: pointer;
    filter: brightness(0.6);
}

/* MEGASEARCH */


/* NAVBAR */
header {
    font-family: var(--nav-font);
    font-size: 15px;
    padding: 0;
}
.nav-div {
  border-right: 2px solid #ffffffaa;
    height: 25px;
    margin-left: 7px;
    margin-right: 0;
}
.vsl-navbar {
    background-color: var(--v-navbar-bgd-color, #00233c);
    color: var(--v-navbar-color, #f8f9fa);
    height: var(--vsl-nav-height);
}
.navbar-dark .navbar-nav .nav-link {
  color: #fff;
  padding-left: 10px;
  padding-right: 10px;
}
header .vsl-navbar-nav>li.nav-item.active>a>span {
  border-bottom: 2px solid #fff;
  border-top: 2px solid transparent;
}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{
    color: inherit;
}
.vsl-nav-link-right {
  color: #fff;
  margin-right: 0;
}
header nav {
    height: var(--vsl-nav-height);
    min-width: 960px;
}
#navbarContent {
  padding-top: 15px;
  height: 100%;
  align-self: flex-end;
  padding-left: max(min(2vw, 35px), 10px);
}
#nav_top {
    padding-top: 15px;
    height: 100%;
    align-self: flex-end;
    padding-left: max(min(2vw, 35px), 10px);
    min-width: auto;
}
#navbarContent > ul > li > a, #nav_top > ul > li > a {
    height: 100%;
    width: auto;
    display: flex;
    align-items: center;
}
#nav_top ul #nav_lang {
    padding-left: 10px;
    padding-right: 10px;
    cursor: default;
}
#nav_top ul #nav_lang a {
    display: inline-flex;
    color: var(--vsl-cream2);
}
#nav_top ul #nav_lang a:hover {
    color: var(--vsl-processblue);
}
#navbarContent > ul > li > a > span {
    padding-top: 5px;
    padding-bottom: 5px;
}
a.navbar-brand {
    margin-left: 10px;
    margin-right: 10px;
    margin-top: auto;
    margin-bottom: auto;
    padding-top: 0;
    padding-bottom: 0;
}
img.vsl-navbar-brand {
  height: 58px;
  min-height: 58px;
  width: 180px;
  min-width: 180px;
  max-width: 180px;
}
ul.vsl-navbar-nav {
    height: 100%
}
header .nav-link {
  padding-left: 10px;
  padding-right: 10px;
}
header a.nav-header {
  color: #fff;
  text-decoration: none;
}
header a.nav-header>h6 {
  padding-left: 10px;
  margin: 0;
  margin-bottom: 10px
}
header #main-nav>.nav-item:hover>a>span {
  border-bottom: 2px solid #ffffff88;
  border-top: 2px solid transparent;
}
header a.nav-header>h6:hover,
header .nav-item.dropdown.megamenu.show .dropdown-menu .nav-link:hover {
    color: #1e2125 !important;
    background-color: #f8f9fa !important;
}
header .nav-item {
  padding: 0;
  cursor: pointer;
}
.dropdown-menu {
    cursor: default;
}
.vsl-nav-link-first {
    font-size: 18px !important;
    font-weight: 600;
    color: #fff;
    height: var(--vsl-nav-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.vsl-nav-link-first:active,
.vsl-nav-link-first:hover {
  color: #fff;
  text-decoration: none;
}
@media (max-width: 991.98px) {
  .vsl-navbar .navbar-nav-scroll {
      width: 100%
  }
  .vsl-navbar .navbar-nav-scroll .navbar-nav {
      margin: -.5rem 0;
      overflow-x: auto;
      white-space: nowrap;
      -webkit-overflow-scrolling: touch
  }
}
.dropdown-menu,
.dropdown-item {
    color: #fff;
    border-radius: 0;
}
.dropdown-menu hr {
    background-color: #fff;
}
.dropdown-item:active,
.dropdown-item:hover {
    color: #1e2125 !important;
    background-color: #f8f9fa !important;
}

/* SEARCH MENU */
.vsl-search-results {
  position: fixed;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
  top: 0;
}
.vsl-search-container {
  padding-top: 100px;
  padding-left: 50px;
  padding-right: 50px;
  padding-bottom: 50px;
  max-width: 1320px;
  margin: 0 auto;
}
.vsl-search-result-container {
  height: calc(100vh - 250px);
  overflow-y: auto;
  margin-top: 40px;
}
.vsl-search-result-container hr {
  color: #fff;
  height: 2px;
}
.vsl-search-section-header {
  color: #fff;
  margin-bottom: 30px;
}
.vsl-search-input {
  border-radius: 0;
  background-color: #00233CE0;
  color: white;
  border-width: 2px;
  border-color: #ffffff60;
}
.sr-items {
  margin-bottom: 20px;
  overflow: auto;
}
.sr-item {
  margin-bottom: 40px;
  margin-left: 20px;
  margin-right: 10px;
}
.sr-item:hover {
  background-color: #41769540;
  box-shadow: 0 0 5px #41769580;
}
.sr-item>a {
  color: #fff;
  text-decoration: none;
}
.sr-item>a>.item-title {
  font-weight: 600;
  font-size: 1.1rem;
  margin-bottom: 15px;
  width: max-content;
  display: inline-block;
}
.sr-item mark {
  color: #fff;
  background-color: #1bb50b;
}
.sr-item>a>.item-href {
  color: #657280;
  margin-bottom: 15px;
  margin-left: 10px;
  width: max-content;
  display: inline-block;
}
.sr-item>a>.item-brief {
  color: #c0cad4;
  margin-right: 10px;
}

/* LINKS */
.vsl-links {
  font-weight: 600
}
@media (min-width: 768px) {
  .vsl-links {
      position: -webkit-sticky;
      position: sticky;
      top: 5rem;
      display: block !important;
      height: calc(100vh - 7rem);
      padding-left: .25rem;
      margin-left: -.25rem;
      overflow-y: auto
  }
}
.vsl-links a {
  padding: .1875rem .5rem;
  margin-top: .125rem;
  color: rgba(0, 0, 0, 0.8);
  text-decoration: none
}
.vsl-links a:hover, .vsl-links a:focus {
  color: rgba(0, 0, 0, 1);
  background-color: rgba(193, 193, 193, 0.3)
}
.vsl-links a:only-child {
  margin-left: 1.25rem
}
@media (prefers-reduced-motion: reduce) {
  .vsl-links a:not(:only-child)::before {
      transition: none
  }
}
.vsl-links a:not(:only-child):not(.collapsed) {
  color: rgba(0, 0, 0, 0.8);
}
.vsl-links a:not(:only-child):not(.collapsed)::before {
  transform: rotate(90deg)
}
.vsl-links a:not(:only-child)::before {
  width: 1.25em;
  line-height: 0;
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
  transition: transform 0.35s ease;
  transform-origin: .5em 50%;
}
.vsl-links a+ul {
  font-size: .875rem
}
.vsl-links .active {
  font-weight: 600;
  color: #417695;
}

.nav-link {
  padding: inherit;
  text-decoration: inherit;
  transition: inherit;
}
.nav {
  display: inherit;
  flex-wrap: inherit;
  padding-left: inherit;
  margin-bottom: inherit;
  list-style: inherit;
}

/* FOOTER */
.vsl-footer {
  color: var(--v-secundary-text, #424242);
  font-size: .875rem;
  background-color: var(--v-footer-bgd-color, #e5e5e5);
  text-align: center;
  font-size: 13px;
}
.vsl-footer>div {
    max-width: 960px; 
    min-width: 900px;
}
.vsl-footer a {
  font-size: 14px;
  color: var(--v-secundary-text-highlight, #424242);  
}
.vsl-footer a:hover, .vsl-footer a:focus {
    font-size: 14px;
    color: var(--v-secundary-text, #424242);
}
.vsl-footer-text {
    margin: 0 auto;
    text-align: center;
}
.vsl-footer-social {
    height: 100%;
    align-items: center;
    display: flex;
}
.vsl-footer-social .navbar-nav {
    flex-direction: row;
}
.vsl-footer-social li {
    filter: brightness(var(--v-icon-brightness-hover));
}
.vsl-footer-social li:active,
.vsl-footer-social li:hover {
    filter: brightness(var(--v-icon-brightness));
}

#social_yt, .youtube_vsl {
    background: url("./svg/w-youtube.svg") no-repeat center;
}
#social_fb, .facebook_vsl {
    background: url("./svg/w-facebook.svg") no-repeat center;
}
#social_ig, .instagram_vsl {
    background: url("./svg/w-instagram.svg") no-repeat center;
}
#social_yt, #social_fb, #social_ig, .youtube_vsl, .facebook_vsl, .instagram_vsl {
    background-size: 25px;
    margin-left: 5px;
    margin-right: 5px;
    width: 25px;
    height: 25px;
}
#social_yt>a, #social_fb>a, #social_ig>a, .youtube_vsl>a, .facebook_vsl>a, .instagram_vsl>a {
    width: 100%;
    height: 100%;
}

/* Bootstrap Modal */

.modal-dialog {
    margin: 8.5rem auto;
}

.modal-content {
    background-color: var(--v-content-bgd-color, #f0f0f0);
    border: 1px solid var(--v-secundary-border, #616161);
    border-radius: 0; 
    color: var(--v-primary-text, #212121);
}

.modal-content .form-control {
    color: var(--v-primary-text, #212121);
    background-color: var(--v-bgd-color, #fafafa);
    border: 1px solid var(--v-secundary-text, #424242);
    border-radius: 0;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.modal-content .form-check-input {
    color: inherit;
    position: inherit;
    font-size: 14px;
    padding: 0;
}

.modal-content .form-check {
    margin-top: 15px;
}

.modal-content a {
    color: var(--v-primary-text, #212121);
    text-decoration: none;
    font-size: 0.95em;
    text-decoration: underline;
}

.modal-content a:hover,
.modal-content a:active {
    color: var(--v-primary-text-highlight);
}

/* MISC START */

iframe {
    max-width: 100%;
}

.callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    border: 1px solid var(--v-secundary-border);
    border-left-width: .25rem;
    border-radius: 3px;
}

#all #fragment .callout h4 {
    margin-top: 0;
    margin-bottom: 8px;
    font-size: 18px;
    font-weight: normal;
}

.callout-blue {
    border-left-color: var(--vsl-midprocessblue);
}
.callout-blue h4 {
    color: var(--vsl-midprocessblue);
}

.callout-orange {
    border-left-color: var(--vsl-orange);
}
.callout-orange h4 {
    color: var(--vsl-orange);
}

.callout-green {
    border-left-color: var(--vsl-green);
}
.callout-green h4 {
    color: var(--vsl-green);
}

/* MISC END */

/* Startpage subbanners START */

.subbanner {
    display: flex;
    overflow: hidden;
}
.subbanner img {
    width: 100%;
    height: 100%;
}
.subbanner .subbannercont {
    position: relative;
    text-align: center;
}
.subbanner .subbannercont>a>div {
    position: absolute;
    top: 12px;
    left: 12px;
    width: calc(100% - 24px);
    color: #ffffff00;
    font-size: 22px;

    transition-property: color;
    transition-duration: 1s;
    filter: drop-shadow(2px 2px 2px black);
}
.subbanner .subbannercont>a {
    display: flex;
    transition-property: -moz-filter, -ms-filter, -o-filter, -webkit-filter, filter,;
    transition-duration: 1.5s;
}
.subbanner .subbannercont > a:hover {
    filter: saturate(2.5) contrast(1.2) grayscale(0.4) brightness(1.3);
}
.subbanner .subbannercont>a:hover>div {
    color: #fff;
}

/* Startpage ads END */


/* Carousel START */

.carousel-control-next, .carousel-control-prev {
    width: 7%;
}
.carousel-control-next:hover, .carousel-control-prev:hover {
    background-color: #ffffff20;
}
.carousel-indicators {
    margin-bottom: 5px;
}
.carousel-indicators [data-bs-target] {
    height: 5px;
}
.carousel-indicators [data-bs-target]:not(.active):hover {
    background-color: var(--vsl-midprocessblue);
}
.carousel-item img {
    transition-property: -moz-filter, -ms-filter, -o-filter, -webkit-filter, filter,;
    transition-duration: 1.5s;
}
.carousel-item img:hover {
    filter: saturate(2.5) contrast(1.2) grayscale(0.4) brightness(1.3);
}

/* Carousel END */

/***** Basic Styles */

body {
    font-family: GothicMT, Arial, Helvetica, Verdana, sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: var(--v-primary-text, #212121);
    background-color: var(--v-bgd-color, #fafafa);
    margin: 0;
}

p {
    line-height: 20px;
    margin: 0 0 20px 0;
}

a {
    text-decoration: none;
    color: var(--v-link-color, #0086cd);
}

a:focus {
    outline: none;
}

h1 {
    font-weight: normal;
    font-size: 21px;
    margin: 0 0 20px 0;
    line-height: 24px;
}

h3 {
    font-weight: normal;
    font-size: 16px;
    margin: 0 0 13px 0;
    line-height: 19px;
}

table {
    border-collapse: collapse;
    empty-cells: show;
}

th {
    text-align: left;
}

img {
    border: none;
    max-width: 100%;
    height: auto;
}

hr {
    height: 1px;
    border-width: 0;
    background-color: var(--v-hr-color, #343a40);
}

.img_default {
    margin-bottom: 19px;
}

#chat-widget-container[style*="height: 450px"],
#chat-widget-container[style*="height: 465px"] {
    height: 600px !important;
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #00233C;
}

input::-moz-placeholder, textarea::-moz-placeholder {
    color: #00233C;
}

select:focus {
    color: var(--vsl-main-grey2);
}

::selection {
    color: #00233C;
    background-color: lightblue;
}

::-moz-selection {
    color: #00233C;
    background-color: lightblue;
}

input, textarea {
    position: relative;
    font-size: 11px;
    border: 1px solid #ADB9C4;
    padding: 3px 10px 4px 10px;
    border-radius: 0;
}

select {
    color: var(--vsl-main-grey1);
    border: 1px solid var(--vsl-border-grey);
    background-color: #fff;
    line-height: 18px;
    height: 21px;
    margin: 3px 18px 6px 0;
    padding: 2px;
    font-size: 11px;
}

.submit {
    display: inline-block;
    margin: 5px 15px;
    line-height: 15px;
    font-size: 11px;
    position: relative;
    padding: 0 8px;
    border: 1px solid var(--v-hr-color);
    background: var(--v-bgd-color);
}

.submit input, .submit button {
    margin: 0;
    outline: 0;
    line-height: 15px;
    color: var(--v-primary-text);
    background: none;
    border: none;
}

.submit.fileinput-button {
    color: #657280;
}

.submit input[type='submit'], .submit button[type='submit'] {
    font-family: inherit;
    cursor: pointer;
}

.submit:hover, .submit a:hover {
    background: var(--v-content-bgd-color);
}

span.submit.lightbluecart {
    background-color: var(--vsl-processblue);
    background-image: none;
    border: 1px solid var(--vsl-darkblue);
    color: var(--vsl-cream2);
}

span.submit.lightbluecart input,
span.submit.lightbluecart a {
    color: var(--vsl-cream2);
}

span.submit.lightbluecart.disabled,
span.submit.lightbluecart.disabled:hover {
    background-color: var(--vsl-midblue);
}

span.submit.lightbluecart:hover,
span.submit.lightbluecart a:hover {
    background-color: var(--vsl-midprocessblue);
    color: var(--vsl-cream2);
}

.checkbox {
    background-image: url("./svg/w-uncheck-square.svg");
    background-size: 12px 12px;
    background-repeat: no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
    min-height: 20px;
    min-width: 20px;
    display: block;
    cursor: pointer;
}

.checkbox:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.checkbox.active {
    background-image: url("./svg/w-check-square.svg");
    background-size: 12px 12px;
    background-repeat: no-repeat;
}

.checkbox.active:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.checkbox.bright {
    background-image: url("./svg/w-uncheck-square.svg");
    background-size: 12px 12px;
    background-repeat: no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
    min-height: 20px;
}

.checkbox.bright:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.checkbox.bright.active {
    background-image: url("./svg/w-check-square.svg");
    background-size: 12px 12px;
    background-repeat: no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
}

.checkbox.bright.active:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.checkbox+input[type="checkbox"], .checkbox+input[type="radio"] {
    display: none;
}

.checkbox_container {
    line-height: 27px;
    vertical-align: middle;
}

.checkbox_container .checkbox {
    background-position: 0 8px;
}

.checkbox_container.fr .cb_label {
    margin-right: 5px;
}

.checkbox_container.c2 {
    width: 352px;
}

.checkbox_container.c3 {
    width: 235px;
}

.checkbox_container.c4 {
    width: 176px;
}

.checkbox_container.c5 {
    width: 141px;
}

.checkbox_container.c6 {
    width: 117px;
}

.checkbox_container div.error, .error_block {
    color: var(--vsl-orange);
    line-height: 14px;
}

ul.error_block {
    background: #f8d7da;
    color: #842029;
    padding: 0 15px;
    font-weight: 600;
    font-size: 14px;
    margin: 15px;
    text-align: center;
    line-height: 30px;
    border: 1px solid #f5c2c7;
    border-radius: 3px;
    list-style: none;
}

.error_block ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.euro {
    font-family: "Eurostile";
    font-weight: normal;
}

.euro9left {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 9px;
    line-height: 11px;
    text-align: left;
}

.euro10 {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
}

.euro115first {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 11.5px;
    line-height: 13.5px;
    margin-bottom: 5px;
}

.euro12 {
    font-family: "Eurostile";
    font-weight: normal;
    line-height: 14px;
}

.euro13 {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 13px;
    line-height: 15px;
}

.euro13first {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 13px;
    line-height: 15px;
    margin-top: 3px;
    margin-bottom: 5px;
}

.euro15 {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 15px;
    line-height: 18px;
}

.euro15left {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 15px;
    line-height: 18px;
    text-align: left;
    padding-left: 60px;
}

.euro17 {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 17px;
    line-height: 19px;
}

.euro20 {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 20px;
    line-height: 22px;
}

.news8 {
    font-size: 8px;
    line-height: 10px;
}

.news9 {
    font-size: 9px;
    line-height: 11px;
}

.news10 {
    font-size: 10px;
    line-height: 12px;
}

.news11 {
    font-size: 11px;
    line-height: 13px;
}

.news11 {
    font-size: 11px;
    line-height: 13px;
}

.news12left {
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 5px;
    padding-left: 8px;
    text-align: left;
}

.news13 {
    font-size: 13px;
    line-height: 15px;
}

.news13low {
    font-size: 13px;
    line-height: 15px;
}

.news14 {
    font-size: 14px;
    line-height: 1.6em;
}

.news15 {
    font-size: 15px;
    line-height: 17px;
}

.news17 {
    font-size: 17px;
    line-height: 19px;
}

.low {
    margin-bottom: 10px;
}

/***** General Classes - check if even used */

.clear {
    clear: both;
    height: 0;
    line-height: 0;
    border: 0;
    background: none;
}

.hidden {
    display: none !important;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.cl {
    clear: left;
}

.cr {
    clear: right;
}

.center {
    text-align: center;
}

.right {
    text-align: right;
}

.left {
    text-align: left;
}

.block {
    display: block;
}

.notransform {
    text-transform: none;
}

.bold, .b {
    font-weight: bold;
}

.italic, .i {
    font-style: italic;
}

.progress {
    cursor: progress;
}

.attention {
    color: var(--vsl-orange);
}

.attention::placeholder {
    color: var(--vsl-orange);
}

.lightblue {
    color: var(--vsl-processblue, #0086cd);
}

.fullwidth {
    width: 100%;
}

.no_border {
    border: 0 !important;
}

.hr {
    height: 1px;
    border-top: 1px solid var(--v-hr-color, #343a40);
}

.inline-block {
    display: inline-block !important;
}

.autoheight {
    height: auto !important;
}

.fixed {
    position: fixed;
    top: var(--vsl-nav-height);
    width: 240px;
    background-color: var(--v-bgd-color, #fafafa);
    z-index: 1;
}

.fixed.sticky .pricebox.box_border:last-child {
    margin-bottom: 0;
}

.fixed.sticky {
    padding-right: 10px;
/*    padding-top: 10px;*/
}

.sticky {
    margin-bottom: 10px;
}

.top_radius {
    border-radius: 0;
}

.bottom_radius {
    border-radius: 0;
}

#fancy_vsl {
    text-align: center;
}

#fancy_vsl .button {
    font-size: 11px;
    min-width: 70px;
    height: 20px;
    padding: 0 8px;
    margin: 20px 5px 0 5px;
    border: 1px solid var(--v-hr-color);
    color: var(--vsl-main-grey1);
    background: var(--vsl-cream1);
}

#fancy_vsl .button:hover {
    font-size: 11px;
    color: var(--vsl-main-grey1);
    background: var(--vsl-cream2);
}

#fancy_vsl a.button {
    display: inline-block;
    font-size: 11px;
    line-height: 19px;
    height: 18px;
    box-sizing: initial;
}

.basket_added {
    text-align: initial;
    max-width: 930px;
    min-width: 250px;
}

.fancy_showonload {
    display: none;
}

/* for fancybox 3.5.7 */
.fancybox-container .fancybox-stage .fancybox-content {
    cursor: auto;
    border-radius: 4px;
    padding: 15px;
}

.fancybox-container .fancybox-bg {
    background: #161212;
}

.fancybox-container.fancybox-is-open .fancybox-bg {
    opacity: .7;
}

.fancybox-slide.fancybox-slide--html {
    padding: 0;
}
.fancybox-content.span1, .fancybox-content.span2, .fancybox-content.span3, .fancybox-content.span4, .fancybox-content.span5, .fancybox-content.span6, .fancybox-content.span7, .fancybox-content.span8 {
    float: none;
}
/* END for fancybox 3.5.7 */

div.fancybox-wrap {
    font-size: 0.95em;
}

.fancybox-content {
    background: var(--v-pricebox-bgd-color, #f0f0f0);
    color: var(--v-primary-text, #212121);
    border-radius: 0 !important;
}

#extplayer .fancybox-content {
    background: var(--v-pricebox-bgd-color, #f0f0f0) !important;
    color: var(--v-primary-text, #212121) !important;
}

#mysettings button, #userprofile button {
    font-size: 11px;
    padding: 3px 6px;
}

#mysettings textarea {
    height: 55px;
}

#mysettings ul, #userprofile ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

#mysettings .form-row, #userprofile .form-row {
    display: flex;
}

#mysettings .form-check-label > .checkbox, #userprofile .form-check-label > .checkbox {
    position: absolute;
    margin-left: -1.25rem;
    margin-top: 4px;
}

.useraddress {
    display: flex;
}

.useraddress .heading {
    padding: 0 0 0.5rem 0;
    position: relative;
}

.useraddress .heading span, .basket2 .edit {
    display: inline-block;
}

.useraddress .heading .title {
    top: -2px;
    position: absolute;
}

.useraddress .heading .add, .useraddress .heading .edit, .useraddress .heading .trash, .basket2 .edit {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
    width: 20px;
    height: 16px;
    cursor: pointer;
}

.useraddress .heading .add:hover, .useraddress .heading .edit:hover, .useraddress .heading .trash:hover, .basket2 .edit:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.useraddress .heading .add {
    background: url("./svg/w-plus-circle.svg") 0px center no-repeat;
}

.useraddress .heading .edit, .basket2 .edit {
    background: url("./svg/w-pencil-square.svg") 0px 1px no-repeat;
}

.useraddress .heading .trash {
    background: url("./svg/w-trash.svg") 0px 1px no-repeat;
}

.upload {
    background: url("./svg/w-upload.svg") center center no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
}

.upload:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.checkcircle {
    margin-right: 90px;
    height: 48px;
    width: 48px;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(115deg) brightness(1.65);
}

.exclamationtriangle {
    height: 48px;
    width: 48px;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(45deg) brightness(2.85);
}

/***** Main Boxes */

#all {
    width: 960px;
    margin: 0 auto;
    position: relative;
    display: flow-root;
    min-height: calc(100vh - 202px);
}

#side, #fragment {
    float: left;
    padding-bottom: 4px;
}

#content {
    float: right;
    padding-bottom: 4px;
    background-color: var(--v-content-bgd-color, #f0f0f0);
}

#content table.thistable a {
    color: var(--v-secundary-text, #424242);
}

#content table.thistable a:hover,
#content table.thistable a:active {
    color: var(--v-secundary-text-highlight, #424242);
}

#top {
    float: right;
}

#fragment ul, #content ul, #fragment ol, #content ol {
    line-height: 18px;
}

#fragment a:hover, #content a:hover {
    color: var(--vsl-processblue, #0086cd);
    text-decoration: underline;
}

#crumb {
    z-index: 10;
    font-size: 11px;
    position: relative;
    background-color: var(--v-breadcrumb-color, #e5e5e5);
    padding: 8px;
}

#crumb a, #crumb span {
    margin-left: 5px;
    color: var(--v-secundary-text, #424242);
}

#crumb a:hover {
    color: var(--v-secundary-text-highlight, #424242);
}

#emb {
    min-height: 300px;
    position: relative;
    overflow: hidden;
    background-color: var(--vsl-darkblue, #00233c);
    line-height: 16px;
    font-size: 13px;
}

/***** Grid */

.grid1 {
    width: 120px;
}

.grid2 {
    width: 240px;
}

.grid3 {
    width: 360px;
}

.grid4 {
    width: 480px;
}

.grid5 {
    width: 600px;
}

.grid6 {
    width: 720px;
}

.grid7 {
    width: 840px;
}

.grid8 {
    width: 960px;
}

/***** Layout */

.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8 {
    float: left;
    min-height: 1px;
}

.span1 {
    width: 120px;
}

.span1.mid {
    padding-left: 20px;
    width: 100px;
}

.span1.last {
    padding-left: 20px;
    width: 100px;
}

.span2 {
    width: 240px;
}

.span2.mid {
    width: 220px;
}

.span2.last {
    margin-left: 20px;
    width: 220px;
}

.span3 {
    width: 360px;
}

.span3.mid {
    padding-left: 20px;
    width: 360px;
}

.span3.last {
    padding-right: 20px;
    width: 340px;
    float: right;
}

.span4 {
    width: 480px;
}

.span4.mid {
    padding-left: 20px;
}

.span4.last {
    padding-left: 20px;
    width: 460px;
}

.span5 {
    width: 600px;
}

.span5.mid {
    padding-left: 20px;
    width: 580px;
}

.span5.last {
    padding-left: 20px;
    width: 580px;
}

.span6 {
    width: 720px;
}

.span6.mid {
    padding-left: 20px;
    width: 700px;
}

.span6.last {
    padding-left: 20px;
    width: 700px;
}

.span7 {
    width: 840px;
}

.span7.last {
    padding-left: 20px;
    width: 820px;
}

.span8 {
    width: 960px;
}

.span6 #fragment .span2.mid, .span6 #fragment .span2.last {
	margin-left: 10px;
    width: 220px;
}

.span6 #fragment .span2.mid.cl {
	margin-left: 20px;
    width: 220px;
}

.span6 #fragment .span4.mid.cl {
    width: 470px;
}

.span6 #fragment .span3 {
    width: 350px;
}

.span6 #fragment .span3.last {
    padding-left: 20px;
    float: left;
    padding-right: 0;
}

.span6 #fragment h4 {
    display: block;
    margin-block-start: 1.33em;
    margin-block-end: 1.33em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    font-size: 14px;
    margin-top: 17px;
    margin-bottom: 17px;
}

.lap {
    margin-top: -30px;
}

.gap {
    padding-top: 20px;
}

.sidegap {
    clear: left;
}

#side {
    padding-right: 10px;
}

#side>div {
    width: 100%;
}
#side>div:first-child {
    height: 332px;
}

#side img, .sidegap img {
    width: 100%;
    height: auto;
}

.ungap {
    margin-top: -16px;
}

.span1.sidegap #box_social:first-child {
    margin-top: 0;
}

/***** SubNav */
#nav_sub {
    list-style: none;
    margin: 1px 0;
    padding-left: 0;
}

#nav_sub>li {
    margin-left: 5px;
}

#nav_sub a {
    display: flex;
    align-items: center;
    font-family: var(--nav-font);
    font-size: calc(14px + var(--nav-font-size));
    padding-left: 8px;
    height: 18px;
    color: var(--v-secundary-text, #424242);
    background: var(--v-bgd-color, #fafafa);
    border-left: 4px solid transparent;
    margin-top: 4px;
    margin-bottom: 4px;
}

#nav_sub a:hover {
    color: var(--v-primary-text, #212121);
    border-left: 4px solid #41769570;
}

#nav_sub a.active {
    color: var(--v-primary-text, #212121);
    border-left: 4px solid var(--vsl-processblue, #0086cd);
}

/***** EmbNav */

#emb img {
    z-index: 20;
    position: absolute;
    top: 0;
    left: 0;
}

#player {
    z-index: 50;
    position: absolute;
    bottom: 0;
}

#player * {
    box-sizing: content-box;
}

.me_container .mejs-controls {
    background: var(--vsl-darker-blue);
}

.me_container .mejs-controls .mejs-time-rail span.mejs-time-slider {
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
}

.me_container .mejs-controls .mejs-time-rail {
    height: 35px;
}

.me_container .mejs-controls .mejs-time-rail span {
    height: 6px;
}

.me_container .mejs-controls .mejs-time-rail .mejs-time-total {
    margin: 7px 5px;
}

.me_container .mejs-controls span.mejs-time-float {
    height: 16px;
}

.me_container .mejs-controls .mejs-time-rail .mejs-time-handle {
    display: block;
    height: 2px;
    background-color: var(--vsl-main-grey1);
    top: 1px;
    width: 18px;
    border: 1px solid var(--vsl-main-grey1);
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}

.video .me_container .mejs-controls .mejs-time-rail .mejs-time-handle, .bigplay .me_container .mejs-controls .mejs-time-rail .mejs-time-handle {
    height: 4px;
}

.me_container .mejs-controls .mejs-time-rail .mejs-time-handle .mejs-time-handle-content {
    display: none;
}

.me_container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current, .me_container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
    height: 6px;
}

.me_container .mejs-controls .mejs-time-rail .mejs-time-current, .me_container .mejs-controls .mejs-time-rail .mejs-time-loaded {
    background: var(--vsl-light-grey);
}

.me_container .mejs-controls .mejs-button button:focus, .mejs-time-total.mejs-time-slider:focus {
    outline: none;
}

.me_container .mejs-controls {
    height: 35px;
    padding: 0;
    margin-bottom: 0px;
}

.me_container .mejs-controls .mejs-time {
    padding: 15px 6px 0;
}

#hideme {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

#nav_emb {
    z-index: 30;
    position: relative;
    color: var(--v-embnav-color, #e5e5e5);
    text-align: center;
    padding-bottom: 5px;
    padding-top: 2px;
}

#nav_emb>* {
    box-sizing: unset;
}

#emb.dimmed #nav_emb {
    background: rgba(3, 4, 10, 0.6);
}

#nav_emb a {
    display: block;
    color: var(--v-embnav-color, #e5e5e5);
}

#nav_emb a:hover, #nav_emb a.active {
    color: var(--vsl-light-grey);
}

#nav_emb ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

#nav_emb li {
    display: block;
}

#nav_emb .head {
    clear: left;
    padding-top: 19px;
}

#nav_emb .row {
    clear: left;
}

#nav_emb .row a, #nav_emb .row p {
    display: inline-block;
    margin: 5px 12px 5px 12px;
}

#nav_emb .comment p {
    margin-top: -19px;
}

#nav_emb .bordertop {
    margin-top: 5px;
    border-top: 1px solid var(--v-secundary-border, #616161);
}

#nav_emb .borderbottom {
    margin-bottom: 5px;
    border-bottom: 1px solid var(--v-secundary-border, #616161);
}

.row li {
    float: left;
    padding-left: 8px;
}

#nav_emb .col1, #nav_emb .col2, #nav_emb .col3, #nav_emb .col4, #nav_emb .col5 {
    float: left;
    margin: 1px;
    padding: 0 6px;
}

#nav_emb .col1 {
    width: 706px;
}

#nav_emb .col2 {
    width: 346px;
}

#nav_emb .col3 {
    width: 226px;
}

#nav_emb .col4 {
    width: 166px;
}

#nav_emb .col5 {
    width: 130px;
}

#nav_emb .col1.boxborder {
    width: 704px;
}

#nav_emb .col2.boxborder {
    width: 344px;
}

#nav_emb .col3.boxborder {
    width: 224px;
}

#nav_emb .col4.boxborder {
    width: 164px;
}

#nav_emb .col5.boxborder {
    width: 128px;
}

#nav_emb .boxempty {
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}

/* Style list with elements */

#nav_emb .boxborder {
    position: relative;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    background: rgba(2, 28, 41, 0.6);
}

.boxborder {
    border: 1px solid var(--v-secundary-border, #616161);
}

.boxborder p {
    margin-bottom: 0px;
}

/***** FragNav */

#nav_frag {
    margin: 0;
    background-color: var(--v-nav-frag-color, #e5e5e5);
    padding: 0;
    height: 38px;
    list-style: none;
    font-size: calc(13px + var(--nav-font-size));
    font-family: var(--nav-font);
}

#nav_frag li {
    display: block;
    float: left;
    white-space: nowrap;
    height: 100%;
}

#nav_frag a {
    color: var(--vsl-midblue, #417695);
    height: 100%;
    align-items: center;
    display: flex;
    padding: 10px;
    font-weight: 600;
}

#nav_frag a:hover {
    color: var(--vsl-processblue, #0086cd);
    background-color: var(--v-nav-frag-color-highlight, #f0f0f0);
    text-decoration: none;
}

#nav_frag li a.active {
    cursor: default;
    color: var(--vsl-processblue, #0086cd);
    background-color: var(--v-nav-frag-color-highlight, #f0f0f0);
}

/***** TopBoxes */

#top_boxes {
    position: absolute;
    top: 30px;
    right: 0;
    color: var(--v-secundary-text, #424242);
    overflow: hidden;
    display: none;
}

#top_boxes a {
    color: var(--v-secundary-text, #424242);
}

#top_boxes a:hover, #txt_rem:hover, #profile_body a:hover {
    color: var(--v-secundary-text-highlight, #424242);
}

#box_search { 
    display: none;
}

#box_profile .text {
    width: 164px;
    height: 20px;
    margin: 0;
    padding: 0 3px 0 3px;
    border: 0;
    color: #D8E2EA;
    background: url("./images/bg_textinput.png") no-repeat;
    line-height: 20px;
}

#box_profile ::-webkit-input-placeholder {
    color: #D8E2EA;
}

#box_profile :-moz-placeholder {
    color: #D8E2EA;
}

#box_profile ::-moz-placeholder {
    color: #D8E2EA;
}

#login_buttons {
    margin-top: 5px;
    text-transform: uppercase;
    font-size: 9px;
    color: #BFC9D3;
}

#login_buttons a:first-child {
    margin-right: 5px;
    display: inline-block;
    font-size: 11px;
}

#box_profile .button {
    width: 71px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
    background-color: #0086CD;
    background-image: none;
    border: 1px solid #0086CD;
    color: #FFF;
}

#box_profile .button:hover {
    background-color: #006BAF;
    border: 1px solid #006BAF;
}

#box_profile input.button {
    line-height: normal;
    text-transform: uppercase;
    margin: 0 2px 0 0;
    height: 22px;
    outline: none;
}

#img_rem {
    margin-left: 10px;
    vertical-align: -2px;
    cursor: pointer;
}

#txt_rem {
    cursor: pointer;
    padding-left: 5px;
}

#box_profile .agree .checkbox_container {
    display: inline-block;
    line-height: 16px;
}

#profile_body .agree .checkbox_container {
    display: inline-block;
    line-height: 7px;
}

#box_profile .agree .checkbox_container span, #profile_body .agree .checkbox_container span {
    display: inline-block;
}

#box_profile .agree .checkbox_container .checkbox {
    background-position: 0 10px;
    min-height: 21px;
}

#profile_body .agree .checkbox_container .checkbox {
    background-position: 4px 3px;
    min-width: 20px;
}

#sel_search {
    width: 170px;
    height: 19px;
    margin: 0;
    padding: 2px;
    border: 0;
    font-size: 11px;
    line-height: 14px;
}


/***** Playlist */

#playlist {
    position: relative;
    color: var(--v-secundary-text, #424242);
    font-size: 12px;
    margin-right: 10px;
}

#playlist.fixedplayer {
    height: 237px;
    width: 100%;
    padding-top: 6px;
    border-top: 1px solid var(--v-hr-color, #343a40);
    margin-top: 10px;
}

#playlist.fixedplayer2 {
    height: 268px;
}

#playlist hr {
    display: none;
}

#playlist .h2 {
    position: relative;
    display: block;
    margin: 0;
    line-height: 11px;
    padding: 6px 5px 6px 15px;
    font-size: 11px;
    font-weight: normal;
    color: var(--v-pricebox-color, #1c1e21);
    background: transparent;
    font-weight: 600;
}

#playlist a {
    float: right;
    color: var(--v-secundary-text, #424242);
}

#playlist a:hover {
    color: var(--v-secundary-text-highlight, #424242);
}

#playlist ul {
    position: relative;
    list-style: none;
    margin: 0 0 0 9px;
    padding: 0;
    font-size: 0.9em;
    line-height: 13px;
}

#playlist li {
    margin: 0;
    padding: 2px 15px 2px 7px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#playlist li::before {
    content: url("./svg/w-play-fill.svg");
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
    float: right;
    height: 12px;
    margin-left: 5px;
}

#playlist li:hover::before {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

#playlist li.active::before {
    content: url("./svg/w-stop-fill.svg");
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.35);
}

#playlist li.active:hover::before {
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.65);
}

#playlist li:hover {
    border-left: 2px solid var(--vsl-midblue, #417695);
    padding-left: 5px;
}

#playlist li.active, #playlist li:hover {
    color: var(--v-secundary-text-highlight, #424242);
}

#playlist li.active {
    border-left: 2px solid var(--vsl-processblue, #0086cd);
    padding-left: 5px;
}

#playlist .openext {
    position: absolute;
    bottom: 2px;
    height: 16px;
    width: 100%;
    text-align: right;
    padding-right: 10px;
}

#playlist .openext span {
    font-size: 9px;
    margin-right: 10px;
    line-height: 16px;
    color: var(--v-link-active-color);
    cursor: pointer;
}

#playlist .openext span:hover {
    color: var(--v-link-color);
}

#playlist.myplayer .openext {
    bottom: 40px;
    padding-right: 0;
}

#playlist.myplayer .openext hr {
    display: none;
}

#playlist .playvideo {
    z-index: 40;
    position: absolute;
    bottom: -10px;
    left: 238px;
    color: #FFF;
    cursor: pointer;
}

#playlist .playvideo .play {
    padding: 10px 20px;
    background-image: url(./images/EmbNav_PlayVideoTrailer_i.png);
    background-position: center center;
    background-repeat: no-repeat;
}

#playlist .playvideo .play:hover {
    background-image: url(./images/EmbNav_PlayVideoTrailer_a.png);
}

#emb .playvideo {
    z-index: 40;
    position: absolute;
    bottom: 46px;
    left: 314px;
    cursor: pointer;
}

#emb .playvideo .play {
    padding: 46px;
    background-image: url(./images/Playbutton_92x92_i.png);
    background-position: center center;
    background-repeat: no-repeat;
}

#emb .playvideo .play:hover {
    background-image: url(./images/Playbutton_92x92_a.png);
}

#playlist.myplayer {
    height: 370px;
    width: 100%;
    padding-top: 6px;
    margin-top: 10px;
    background-color: var(--v-content-bgd-color);
}

#playlist.myplayer ul.audio {
    margin-bottom: 10px;
    height: 285px;
    overflow-x: auto;
    margin-right: 10px;
}

#playlist_buttons {
    position: absolute;
    bottom: 0px;
    display: inline-flex;
    width: 100%;
}

#playlist_buttons a {
    float: left;
    width: 25%;
    border-right: 1px solid var(--v-content-bgd-color);
    text-align: center;
    white-space: nowrap;
    font-size: 9px;
    line-height: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
    color: var(--v-secundary-text, #424242);
    height: 35px;
    background-color: var(--v-music-top-bgd);
}

#playlist_buttons a:hover {
    background: var(--vsl-midblue);
    color: var(--vsl-cream2);
}

/* Load dialog */

#playlistID {
    min-width: 220px;
    margin-right: 0;
}

/* Save/SaveAs dialog */

#Title {
    min-width: 220px;
}

/***** BoxSocial */

#box_social {
    display: block;
    height: 30px;
    margin: 0 0 14px 0;
    padding-left: 0;
    list-style: none;
}

#box_social li {
    float: left;
    padding-right: 10px;
}

#box_social .facebook_vsl a {
    display: block;
    width: 24px;
    height: 24px;
    background: url('./images/SSV_Footer_FB_inact.png') no-repeat 0 0;
}

#box_social .facebook_vsl a:hover {
    background: url('./images/SSV_Footer_FB_act.png') no-repeat 0 0;
}

#box_social .youtube_vsl a {
    display: block;
    width: 24px;
    height: 24px;
    background: url('./images/SSV_Youtube_Circle_24x24_inactive.png') no-repeat 0 0;
}

#box_social .youtube_vsl a:hover {
    background: url('./images/SSV_Youtube_Circle_24x24_active.png') no-repeat 0 0;
}

#box_social .instagram_vsl a {
    display: block;
    width: 24px;
    height: 24px;
    background: url('./images/Social_Insta_inactive_24x24.png') no-repeat 0 0;
}

#box_social .instagram_vsl a:hover {
    background: url('./images/Social_Insta_active_24x24.png') no-repeat 0 0;
}

#box_social .referral_vsl a {
    display: block;
    width: 24px;
    height: 24px;
    background: url('./images/SSV_Footer_rec_inact.png') no-repeat 0 0;
}

#box_social .referral_vsl a:hover {
    background: url('./images/SSV_Footer_rec_act.png') no-repeat 0 0;
}

/***** BoxBorder - PriceBox, InstrInProd */

.box_border {
    font-size: 11px;
    margin-bottom: 10px;
    padding: 7px 10px;
    color: var(--v-secundary-text, #424242);
}

.box_border h4 {
    margin: 0;
    font-size: 13px;
    font-weight: normal;
}

.box_border h5 {
    font-size: 11px;
}

.box_border p {
    font-size: 10px;
    line-height: 12px;
    margin-bottom: 0;
    text-align: center;
}

/* for HTML module */
.box_border .box_border p {
    font-size: 11px;
    line-height: 15px;
    margin-bottom: 7px;
    text-align: left;
}

.box_border hr {
    margin: 8px 0 7px 0;
    height: 1px;
    background: var(--v-secundary-border, #616161);
    border: none;
}

.box_border dl {
    margin: 4px 0 10px 5px;
    line-height: 20px;
}

.box_border dt {
    position: relative;
    float: left;
    clear: left;
    padding-left: 40px;
}

.box_border dd {
    text-align: right;
}

.box_border dt a {
    position: absolute;
    top: 0;
    left: 0;
}

.box_border .disabled {
    color: var(--vsl-grey);
}

.box_border .strike {
    text-decoration: line-through;
}

.box_border .attention {
    color: var(--vsl-orange);
}

.box_border ul {
    margin: 0 0 10px 15px;
    padding-left: 0;
    list-style: none;
}

.collection_name a {
    color: var(--vsl-midblue, #417695);
}

.lastvisited .collection_name {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    margin-left: 0;
    margin-bottom: 0px;
}

.lastvisited .collection_name li {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lastvisited .hotspot_foldable {
    font-size: 11px;
    background-size: 8px 8px;
    font-family: GothicMT, Arial, Helvetica, Verdana, sans-serif;
    background-position: 0px 6px;
    margin-bottom: 0;
}

.lastvisited .collection_name.open .hotspot_foldable {
    background-position: 0px 6px;
}

.pricebox {
    background-color: var(--v-pricebox-bgd-color, #f0f0f0);
    color: var(--v-pricebox-color, #1c1e21);
}

.pricebox .collection_name {
    font-family: "Eurostile";
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    margin-left: 0;
}

.pricebox .collection_product {
    margin: 25px 0 0 0;
}

.pricebox .collection_product.no_topgap {
    margin-top: 0;
}

.pricebox.box_border dl {
    margin-left: 0px;
}

.pricebox p {
    text-transform: uppercase;
}

.pricebox dt {
    padding-left: 0;
}

.pricebox dd.promo_avail, .void_price {
    text-decoration: line-through;
}

.pricebox .buy {
    min-height: 17px;
    min-width: 31px;
}

span.buy {
    display: inline-block;
    color: #FFF;
    padding-left: 10px;
    padding-right: 35px;
    cursor: pointer;
    background: url("./images/basket-arrow.png") 95% center no-repeat;
}

span.nobuy {
    text-transform: uppercase;
}

.pricebox .lightbluecart {
    background-color: #0086CD;
    border: 1px solid #0086CD;
}

.pricebox .lightbluecart:hover {
    background-color: #006BAF;
    border: 1px solid #006BAF;
}

.pricebox .priceterm {
    display: inline-block;
}

.pricebox .info.hideable {
    display: none;
}

.pricebox .info {
    height: 15px;
    width: 15px;
    margin-left: 6px;
    padding-top: 3px;
    content: url("./svg/w-info-square.svg");
    filter: brightness(var(--v-icon-brightness, 0.2));
}

.pricebox .info:hover {
    cursor: pointer;
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.pricebox .bundlesavings {
    font-size: 10px;
    line-height: 14px;
    padding: 2px 0px;
}

.pricebox .bundlesavings .attention {
    color: var(--vsl-orange);
}

.pricebox .promo_price {
    color: var(--vsl-orange);
    font-weight: bold;
}

.your_price {
    color: var(--vsl-processblue, #0086cd);
    font-weight: bold;
}

.pricebox .bundlesavings dl {
    float: right;
    width: 105px;
    margin-top: 0;
    line-height: 14px;
}

.pricebox .bundlesavings dl.usd {
    width: 126px;
}

.pricebox .bundlesavings dt {
    display: block;
    width: 55px;
    text-align: right;
}

.pricebox .bundlesavings dl.usd dt {
    width: auto;
}

.priceloadinganimation {
    margin: 20px 70px;
    -webkit-animation: 1s linear infinite spinner-border;
    animation: 1s linear infinite spinner-border;
    border: 5px solid var(--v-secundary-text);
    width: 75px;
    height: 75px;
    border-right-color: transparent;
    border-radius: 50%;
}

/***** FANCY BUNDLE SAVINGS *****/

.bundlesavings.hideable {
    margin: 8px;
    max-width: 900px;
}

table.bundlesavings {
    width: 100%;
}

table.bundlesavings td {
    padding-right: 25px;
    white-space: nowrap;
}

table.bundlesavings .total {
    border-top: 1px solid #BBC2C9;
}

table.bundlesavings .head {
    font-style: italic;
}

table.bundlesavings .bundle td, table.bundlesavings .savings.first td {
    padding-top: 15px;
}

table.bundlesavings .price {
    text-align: right;
    padding-right: 0;
}

table.bundlesavings .price.fulllib {
    padding-left: 25px;
}

table.bundlesavings .bundle {
    font-weight: bold;
}

table.bundlesavings .savings.second {
    border-bottom: 1px solid #BBC2C9;
}

table.bundlesavings .savings, .bundlesavings a.savings {
    color: #E64505;
}

table.bundlesavings.pricecol1 .price.fulllib {
    display: none;
}

table.bundlesavings .hint {
    white-space: normal;
    padding-right: 0;
    padding-top: 15px;
}

table.bundlesavings .hint p {
    margin-bottom: 0;
}

table.bundlesavings .hint p:first-child {
    margin-bottom: 19px;
}

table.bundlesavings tbody tr:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

table.bundlesavings tbody tr.head:hover, table.bundlesavings tbody tr td.hint:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

table.specialoffer {
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 19px;
    border: 0px;
    border-collapse: collapse;
    box-sizing: unset;
}
table.specialoffer * {
    box-sizing: unset;
}

table.specialoffer th {
    font-weight: bold;
    line-height: 19px;
    vertical-align: top;
    padding-top: 2px;
    padding-bottom: 2px;
}

table.specialoffer th.price, table.specialoffer th.sprice {
    text-align: center;
}

table.specialoffer th.sprice {
    color: var(--vsl-orange);
}

table.specialoffer td {
    line-height: 19px;
    vertical-align: top;
    padding-top: 2px;
    padding-bottom: 2px;
}

table.specialoffer td.slim {
    line-height: 7px;
}

table.specialoffer td.price, table.specialoffer td.sprice {
    text-align: right;
    padding-right: 20px;
}

table.specialoffer td.sprice {
    color: var(--vsl-orange);
    font-weight: bold;
}

table.repertoire {
    border-collapse: collapse;
    border-spacing: 0px;
    margin-bottom: 19px;
    width: 100%;
    border-top: 1px solid #BBC2C9;
}

table.repertoire col.composer {
    width: 200px;
}

table.repertoire th {
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 8px;
    font-size: 16px;
    font-weight: normal;
    line-height: 19px;
}

table.repertoire td {
    vertical-align: top;
    font-size: 11px;
    padding: 2px;
}

/***** FANCY PRICE_BOX SAVINGS *****/

.infosibling.hideable {
    margin: 8px;
    /*width: 750px;*/
}

table.price_info {
    width: 100%;
}

table.price_info td {
    padding-right: 25px;
    white-space: nowrap;
}

table.price_info .total {
    border-top: 1px solid #BBC2C9;
}

table.price_info .price {
    opacity: 0.5;
    padding-left: 0;
    text-align: right;
    padding-right: 0;
    padding-left: 25px;
}

table.price_info .price.yourprice {
    opacity: 1;
}

table.price_info .bundle {
    font-weight: bold;
}

table.price_info .bundle td, table.price_info .savings.first td {
    padding-top: 15px;
}

table.price_info .savings.second {
    border-bottom: 1px solid #BBC2C9;
}

table.price_info .savings {
    color: var(--vsl-orange, #E64505);
}

table.price_info .head td {
    padding-bottom: 15px;
}

table.price_info tbody tr:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

table.price_info tbody tr.head:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

#debug {
    width: 960px;
    min-height: 400px;
    display: none;
}

.debugtable {
    float: left;
    margin-right: 5px;
    font-size: inherit;
}

.debugtable caption {
    cursor: pointer;
    white-space: nowrap;
}

.debugtable tbody {
    display: none;
}

#login_buttons a.forgotten {
    color: var(--v-highlight-red);
    font-weight: bold;
}

#login_buttons a.forgotten:hover {
    color: #FFF;
}

input#PassResetEmail {
    width: 380px;
}

div.passreset {
    width: 400px;
}

.submit.passreset {
    margin: 20px 0 0 0;
}

/***** HTML MODUL *****/

.sup {
    font-size: 75%;
    vertical-align: 3px;
}

.sub {
    font-size: 75%;
    vertical-align: -3px;
}

/***** PARAGRAPH MODUL *****/

div.par.foldable {
    margin-bottom: 19px;
}

div.par.foldable.open {
    margin-bottom: 0;
}

.foldable h3.hotspot_foldable {
    cursor: pointer;
}

.foldable.open h3.hotspot_foldable::before {
    transform: rotate(90deg);
}

.foldable h3.hotspot_foldable:hover::before {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.foldable h3.hotspot_foldable::before {
    content: url("./svg/w-chevron-right.svg");
    filter: brightness(var(--v-icon-brightness, 0.2));
    width: 1.25em;
    transition: transform 0.35s ease;
    transform-origin: .5em 50%;
    display: inline-block;
    margin: 0 6px 0 2px;
    vertical-align: middle;
}

div.foldable.open>*, div.foldable>.hotspot_foldable, div.foldable .head {
    display: block;
}

div.foldable>* {
    display: none;
}

/**** GALLERY MODUL ****/

.gallery {
    position: relative;
    width: 700px;
    left: -20px;
    display: block;
    /* flex-wrap: wrap; */
}

.gallery div {
    float: left;
    padding-left: 20px;
    padding-bottom: 5px;
}

.gallery img {
    margin-bottom: 16px;
}
.gallery img[width="700"] {
    width: 680px;
}
.gallery img[width="346"] {
    width: 330px;
}
.gallery img[width="220"],
.gallery img[width="228"] {
    width: 213px;
}

.gallery.withsubline img, .gallery.nosubline img {
    margin-bottom: 20px;
}

.gallery h5 {
    position: relative;
    padding: 0;
    margin-top: -14px;
    font-size: 10px;
}

.gallery.nosubline h5 {
    color: transparent;
}

.gallery a.dwl {
    float: right;
    height: 18px;
    width: 28px;
    background-repeat: no-repeat;
    margin-top: -2px;
    margin-right: -10px;
}

/**** PROMO CODE MODUL ****/

.mod_promo_text {
    text-align: center;
    font-size: 16px;
}

.mod_promo_code {
    text-align: center;
    font-size: 23px;
    font-weight: 700;
    color: var(--vsl-processblue, #0086cd);
}

/***** PRODUCT SAMPLES *****/

.patchtbl {
    width: 100%;
    font-size: inherit;
    margin-bottom: 6px;
}

.patchtbl caption {
    margin: 0 0 15px -12px;
    font-weight: normal;
    font-size: 14px;
    text-align: left;
    white-space: nowrap;
}

.patchtbl.foldable caption {
    cursor: pointer;
}

.patchtbl.foldable caption::before {
    content: url("./svg/w-chevron-right.svg");
    filter: brightness(var(--v-icon-brightness, 0.2));
    width: 1.25em;
    transition: transform 0.35s ease;
    transform-origin: .5em 50%;
    display: inline-block;
    margin: 0 6px 0 2px;
    vertical-align: middle;
}

.patchtbl.foldable caption:hover::before {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.patchtbl.foldable.open caption::before {
    transform: rotate(90deg);
}

.patchtbl.foldable.open caption:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.patchtbl.foldable thead, .patchtbl.foldable tbody {
    display: none;
}

.patchtbl.foldable.open thead, .patchtbl.foldable.open tbody {
    display: table-row-group;
}

.patchtbl th {
    background-color: var(--v-nav-frag-color, #e5e5e5);
    font-weight: bold;
    text-transform: uppercase;
}

.patchtbl th, .patchtbl td {
    padding: 2px;
    vertical-align: top;
    border: 1px solid var(--v-nav-frag-color, #e5e5e5);
}

.patchtbl td {
    line-height: 14px;
}

.patchtbl .patchgroup, .patchtbl .patchinstr {
    width: 205px;
}

.patchtbl .extpatch {
    width: 240px;
}

.patchtbl ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.patchtbl li {
    padding-bottom: 5px;
}

/***** DEMOLIST *****/

#content .tracktbl {
    line-height: 19px;
}

.tracktbl {
    width: 100%;
}

.tracktbl tbody .title {
    padding-left: 30px;
}

.tracktbl tbody .info + .title {
    padding-left: 0;
}

/* styling of the column for .play, .add, .del */

.res, .basket .table td.res {
    width: 13px;
    max-width: 13px;
    padding-left: 4px;
    padding-right: 4px;
}

.tracktbl caption {
    margin: 15px 0 10px 2px;
    font-weight: bold;
    text-align: left;
    position: relative;
    white-space: nowrap;
}

.tracktbl.foldable caption {
    cursor: pointer;
}
.tracktbl.foldable caption::before {
    content: url("./svg/w-chevron-right.svg");
    filter: brightness(var(--v-icon-brightness, 0.2));
    width: 1.25em;
    transition: transform 0.35s ease;
    transform-origin: .5em 50%;
    display: inline-block;
    margin: 0 6px 0 2px;
    vertical-align: middle;
}

.tracktbl.foldable caption:hover::before {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.tracktbl.foldable.open caption::before {
    transform: rotate(90deg);
}

.tracktbl.foldable.open caption:before:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.tracktbl.foldable thead .title::before {
    content: url("./svg/w-chevron-right.svg");
    filter: brightness(var(--v-icon-brightness, 0.2));
    width: 1.25em;
    transition: transform 0.35s ease;
    transform-origin: .5em 50%;
    display: inline-block;
    margin: 0 6px 0 2px;
    vertical-align: middle;
}

.tracktbl.foldable tbody {
    display: none;
}

.tracktbl.foldable thead .title {
    cursor: pointer;
}

.tracktbl.foldable.open thead .title::before {
    transform: rotate(90deg);
}

.tracktbl.foldable.open thead .title:hover::before {
    filter: brightness(var(--v-icon-brightness, 0.2));
}

.tracktbl.foldable.open {
    margin-bottom: 20px;
}

.tracktbl.foldable.open tbody {
    display: table-row-group;
}

.tracktbl tbody tr:hover, .tracktbl tbody tr.active, #extplayer #player_playlist_browser .tracktbl tbody tr:hover, #extplayer #player_playlist_browser .tracktbl tbody tr.active {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

tr.hotspot_detail {
    cursor: pointer;
}

.tracktbl .composer {
    width: 150px;
}

.tracktbl .duration {
    width: 40px;
    text-align: right;
    padding-right: 8px;
}

.tracktbl .play {
    background: url("./svg/w-play-fill.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
}

.tracktbl .play:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.tracktbl .play.active {
    background: url("./svg/w-stop-fill.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.35);
}

.tracktbl .play.active:hover {
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.65);
}

.tracktbl .add.active {
    background: url("./svg/w-plus-square.svg") center no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
    cursor: pointer;
}

.tracktbl .add.active:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.tracktbl .del {
    background: url("./svg/w-close.svg") center no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
    cursor: pointer;
}

.tracktbl .del:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

/* table in music top area (masterpieces) */

.tr_hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

.playlist.tracktbl tbody tr:hover, .playlist.tracktbl tbody tr.active {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

.playlist.tracktbl tbody .info, #extplayer .tracktbl tbody .info {
    background: url("./svg/w-info-square.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
    padding: 0 0 0 21px;
}

.playlist.tracktbl tbody .info:hover, #extplayer .tracktbl tbody .info:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.playlist.tracktbl tbody .title {
    padding: 3px 0;
}

.playlist.tracktbl .add {
    background: url("./svg/w-plus-square.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.35);
}

.playlist.tracktbl .add:hover {
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.65);
}

#music_browse {
    float: left;
    background: var(--v-content-bgd-color, #f0f0f0);
}

#music_browse .tracktbl {
    font-size: 11px;
    line-height: 15px;
    width: 100%;
}

#music_browse .tracktbl tr {
    white-space: nowrap;
}

#music_browse .tracktbl tbody .title {
    padding-left: 23px;
    float: left;
    width: 154px;
    overflow: hidden;
    text-overflow: ellipsis;
}

#music_browse .tracktbl thead {
    border-top: none;
}

#music_browse .tracktbl .add {
    background: url("./svg/w-plus-square.svg") center no-repeat;
    width: 20px;
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.35);
}

#music_browse .tracktbl .add:hover {
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.65);
}

#music_browse .tracktbl th.title {
    padding-left: 5px;
    max-width: 218px;
    overflow: hidden;
    text-overflow: ellipsis;
}

#music_browse .tracktbl caption {
    padding: 1px 1px 1px 5px;
    max-width: 235px;
    overflow: hidden;
}

#music_browse .music_result .music_col .tut_avail {
    background: url("./svg/w-play-btn-fill.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
}

#music_browse .music_result .music_col .tut_avail:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

#music_browse .music_result .music_col .active .tut_avail {
    background: url("./svg/w-stop-fill.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.35);
}

#music_browse .music_result .music_col .active .tut_avail:hover {
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.65);
}

/* vertical separation line in music search result */

.music_result .music_col {
    float: left;
    margin-bottom: 30px;
    margin-left: 8px;
    padding-left: 7px;
    border-left: 1px solid #C9CBCC;
}

.music_result .music_col:first-child {
    border-left: none;
}

img.left, div.left img {
    float: left;
    margin-right: 20px;
    margin-bottom: 5px;
    padding-top: 5px;
}

img.right, div.right img {
    float: right;
    margin-left: 20px;
    margin-bottom: 5px;
    padding-top: 5px;
}

img.imgleft, div.imgleft img {
    float: left;
    margin-right: 20px;
    margin-bottom: 5px;
    padding-top: 5px;
}

img.imgright, div.imgright img {
    float: right;
    margin-left: 20px;
    margin-bottom: 5px;
    padding-top: 5px;
}

/***** AUDIODEMOLIST / VIDEODEMOLIST *****/

.audiodemolist.tracktbl tbody .info, .videodemolist.tracktbl tbody .info {
    width: 50px;
    background: url("./svg/w-info-square.svg") 27px center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
}

.audiodemolist.tracktbl tbody .info:hover, .videodemolist.tracktbl tbody .info:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.audiodemolist.tracktbl tbody tr.detail:hover, .videodemolist.tracktbl tbody tr.detail:hover, #extplayer .tracktbl tbody tr.detail:hover {
    cursor: default;
    background-color: inherit;
}

table.audiodemolist, table.videodemolist {
    font-size: 0.9em;
}

.audiodemolist.tracktbl tbody tr.hotspot_detail:hover .play,
.videodemolist.tracktbl tbody tr.hotspot_detail:hover .play,
.audiodemolist.tracktbl tbody tr.hotspot_detail .play:hover,
.videodemolist.tracktbl tbody tr.hotspot_detail .play:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.audiodemolist.tracktbl tbody tr.hotspot_detail:hover .play.active,
.videodemolist.tracktbl tbody tr.hotspot_detail:hover .play.active,
.audiodemolist.tracktbl tbody tr.hotspot_detail .play.active:hover,
.videodemolist.tracktbl tbody tr.hotspot_detail .play.active:hover {
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.65);
}

.audiodemolist.tracktbl tbody tr.detail td {
    padding: 0 0 0 30px;
}

.audiodemolist .back, .audiodemolist .head, .videodemolist .back, .videodemolist .head {
    display: none;
}

.audiodemolist .uline, .videodemolist .uline {
    border-bottom-color: var(--v-hr-color);
    padding-left: 0;
}

.audiodemolist .uline .nav, .videodemolist .uline .nav {
    width: 100px;
}

.audiodemolist .uline ul {
    width: 215px;
}

.audiodemolist .uline>div, .videodemolist .uline>div {
    background: none;
    padding: 0;
    min-height: 0;
}

.audiodemolist .uline .hr, .videodemolist .uline .hr {
    margin: 5px 0;
}

.audiodemolist .uline .nav .active, .audiodemolist .uline .nav span:hover, .videodemolist .uline .nav .active, .videodemolist .uline .nav span:hover {
    color: inherit;
    cursor: default;
}

.audiodemolist .actions {
    color: inherit;
}

.audiodemolist .uline.layered, .videodemolist .uline.layered {
    padding-right: 0;
}

.audiodemolist .instruments ul.arr1 {
    width: 565px;
}

.audiodemolist .instruments ul.arr2 {
    width: 282px;
}

.audiodemolist .instruments ul.arr3 {
    width: 188px;
}

.audiodemolist .instruments ul.arr4 {
    width: 141px;
}

.audiodemolist .instruments ul.arr5 {
    width: 113px;
}

.videodemolist.tracktbl tbody tr.detail td {
    padding: 0 0 0 20px;
}

.videodemolist dl {
    margin: 0;
}

.videodemolist dl:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

.videodemolist dt {
    float: left;
    width: 32px;
    text-align: right;
}

.videodemolist .cue_point {
    cursor: pointer;
}

.videodemolist .bigplay {
    background: url("./svg/w-play-btn-fill.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
}

.videodemolist .bigplay:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.chapters.bigplay .videodemolist {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 45px;
    color: #C0CAD4;
    padding: 10px 0;
}

.chapters.bigplay .videodemolist dl {
    padding: 0 6px;
}

.chapters.bigplay .videodemolist dl:hover {
    background-color: #16364D;
}

.chapters.bigplay .videodemolist dl dd {
    display: none;
    margin-left: 15px;
}

.chapters.bigplay .videodemolist:hover {
    width: auto;
    background-color: #00233C;
}

.chapters.bigplay .videodemolist:hover dl dd {
    display: inline;
}

.chapters.bigplay .me_container {
    position: relative;
    padding-left: 0;
}

.chapters.bigplay.fancybox-content {
    padding: 0;
    background: #4d4d4d;
    overflow: hidden;
}

/* Generelle Redakteursseiten */

div.spliterleft {
    margin-bottom: 20px;
    border-bottom: 1px solid var(--v-hr-color);
}

div.spliterleft img {
    float: left;
    margin-left: 0;
    margin-bottom: 19px;
}

div.spliterleft p, div.spliterleft ul, div.spliterleft ol {
    margin-left: 120px;
    list-style-type: none;
}

div.spliterright {
    overflow: auto;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #657280;
}

div.spliterright img {
    float: right;
    margin-left: 10px;
    margin-bottom: 19px;
}

div.spliterright p, div.spliterright ul, div.spliterright ol {
    margin-right: 232px;
    list-style-type: none;
}

/* Playing Techniques - Academy */

#techniques {
    top: 10px;
    height: 60px;
    position: relative;
}

#techniques .smpl {
    position: absolute;
    height: 21px;
    width: 26px;
    background: url("./images/0play.gif") no-repeat center center;
}

#techniques .smpl.active {
    background: url("./images/1play.gif") no-repeat center center;
}

/* MUSIC */

#music * {
    box-sizing: unset;
}

#music {
    position: relative;
    color: var(--v-primary-text, #212121);
    height: 300px;
    margin: 0;
    padding: 0;
    background-color: var(--v-music-top-bgd, #e5e5e5);
}

#music .hr {
    height: 1px;
    background: var(--v-primary-text, #212121);
    border: none;
    margin: 0;
}

#hideme .tracktbl {
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
}

#music ul, .uline ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#music .tracktbl .play, #extplayer #player_playlist .tracktbl .play {
    background: url("./svg/w-play-fill.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
}

#music .tracktbl .play:hover, #extplayer #player_playlist .tracktbl .play:hover {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

#music .tracktbl .play.active, #extplayer #player_playlist .tracktbl .play.active, #extplayer #player_playlist #playlist_start.active {
    background: url("./svg/w-stop-fill.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.35);
}

#music .tracktbl .play.active:hover, #extplayer #player_playlist .tracktbl .play.active:hover, #extplayer #player_playlist #playlist_start.active:hover {
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.65);
}

.border_right {
    border-right: 1px solid #C9CBCC;
}

#music_title {
    line-height: 30px;
    padding-left: 15px;
    border-bottom: 1px solid var(--v-primary-text, #212121);
    font-weight: 600;
}

.white {
    color: #FFF;
}

.copylink {
    cursor: pointer;
    background: none;
    position: absolute;
    right: 20px;
    bottom: 6px;
    user-select: none;
}

.copylink:hover {
    color: #FFF;
}

.music_detail .head {
    position: relative;
    padding: 8px 20px 0 12px;
    color: var(--v-primary-text, #212121);
    border-bottom: 1px solid #667783;
    user-select: none;
}

.music_detail .head ul {
    display: inline-block;
    position: relative;
    padding-bottom: 4px;
    width: 340px;
}

.music_detail .head li {
    text-align: right;
}

.music_detail .head .first li {
    padding-left: 18px;
    text-align: left;
    white-space: nowrap;
    width: 500px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.music_detail .head .first .title {
    line-height: 15px;
    font-size: 13px;
    width: 640px;
}

.music_detail .head .first .title::before {
    content: url("./svg/w-play-fill.svg");
    vertical-align: middle;
    width: 20px;
    margin-left: -20px;
    margin-right: 4px;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
}

.music_detail .head .first .title:hover::before {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.music_detail .head .title.active::before {
    content: url("./svg/w-stop-fill.svg");
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.35);
}

.music_detail .head .title.active:hover::before {
    filter: brightness(0.5) sepia(1) saturate(6000%) hue-rotate(30deg) brightness(1.65);
}

.music_detail .head .title {
    cursor: pointer;
}

.music_detail .back {
    cursor: pointer;
    position: absolute;
    top: 8px;
    right: 8px;
    width: 16px;
    height: 16px;
    background: url("./svg/w-close.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(9000%) hue-rotate(30deg) brightness(1.35);
}

.music_detail .back:hover {
    filter: brightness(0.5) sepia(1) saturate(9000%) hue-rotate(30deg) brightness(2.5);
}

.uline span.copylink {
    display: none;
}

/* copylink functionality deferred to later version */

.uline {
    font-size: 11px;
    padding: 5px 25px 5px 30px;
    text-align: left;
    border-bottom: 1px solid #667783;
}

.uline.layered {
    padding-right: 5px;
}

.uline ul {
    display: inline-block;
    position: relative;
    padding-bottom: 1px;
    width: 219px;
    float: left;
}

.uline .nav {
    color: #657280;
    width: 100px;
}

.uline .nav span:hover {
    color: #C0CAD4;
    cursor: pointer;
}

.uline .nav li {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.uline .nav li.active {
    color: var(--v-secundary-text, #424242);
}

.uline>div {
    margin-left: 100px;
    padding: 5px 0 5px 5px;
    min-height: 36px;
}

.uline>div.cl {
    background: none;
    min-height: 0;
    padding: 0;
}

.instruments ul {
    width: 116px;
    float: left;
}

.instruments ul.arr1 {
    width: 580px;
}

.instruments ul.arr2 {
    width: 290px;
}

.instruments ul.arr3 {
    width: 193px;
}

.instruments ul.arr4 {
    width: 145px;
}

.instruments ul.arr5 {
    width: 116px;
}

.actions {
    position: relative;
    font-size: 10px;
    color: var(--v-secundary-text, #424242);
    padding: 5px 5px 5px 10px;
    margin-bottom: 20px;
}

.actions span.add::before {
    content: url("./svg/w-plus-square.svg");
    vertical-align: middle;
    margin-right: 7px;
    width: 20px;
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.35);
}

.actions span.add:hover::before {
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.65);
}

div#music {
    box-sizing: unset;
}

#music .actions span.add::before {
    content: url("./svg/w-plus-square.svg");
    vertical-align: middle;
    margin-right: 7px;
    width: 20px;
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.35);
}

#music .actions span.add:hover {
    filter: brightness(0.5) sepia(1) saturate(8000%) hue-rotate(90deg) brightness(1.65);
}

.actions span {
    cursor: pointer;
    display: inline-block;
    padding: 1px 0 1px 20px;
}

.dwl::before,
#music .dwl::before {
    content: url("./svg/w-download.svg");
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
    margin-right: 7px;
    vertical-align: middle;
}

.videodemolist .dwl::before {
    position: absolute;
}

.dwl:hover:before {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.video.dwl {
    background: url("./images/download_dark_n_i.png") right center no-repeat;
    height: 11px;
    padding: 8px 0px 0px 4px;
}

.video.dwl:hover {
    background: url("./images/download_dark_n_a.png") right center no-repeat;
}

.video.bigplay {
    background: url("./svg/w-play-btn-fill.svg") center no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
    vertical-align: middle;    
    width: 20px;
    height: 20px;
    padding: 8px 0px 0px 4px;
    cursor: pointer;
}

.video.bigplay:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.video {
    position: relative;
}

.video .me_container {
    position: absolute;
}

.unmute {
    cursor: pointer;
    width: 100%;
    height: 100%;
    position: absolute;
    background: url("./images/Unmute_48x48_shadow_i.png") 6px center no-repeat;
    z-index: 2;
}

.unmute:hover, .unmute.light {
    background-image: url("./images/Unmute_48x48_shadow_a.png");
}

.small {
    font-size: 9px;
}

#music_search {
    min-width: 715px;
    position: relative;
    background: var(--v-music-top-bgd, #e5e5e5);
    padding-left: 5px;
    border-radius: 0;
    box-sizing: unset;
}

#music_search #suggest {
    position: absolute;
    top: 25px;
    left: 22px;
    background-color: var(--v-bgd-color);
    border: 1px solid var(--v-secundary-border);
    padding: 3px 5px;
    display: none;
    z-index: 1;
}

#music_search #suggest span {
    display: block;
    cursor: pointer;
}

#music_search #suggest span:hover {
    background-color: var(--v-content-bgd-color);
}

#music_pattern {
    margin-left: 17px;
    height: 19px;
    line-height: 19px;
}

#music_search select {
    width: 114px;
    margin: 5px 0 5px 8px;
}

#music_char {
    min-width: 715px;
    background: var(--v-music-top-bgd, #e5e5e5);
    color: var(--v-primary-text, #212121);
    box-sizing: unset;
}

#music_char span {
    display: block;
    float: left;
    width: 27px;
    text-align: center;
    padding: 5px 0;
}

#music_char .busy {
    color: #96A4AE;
    cursor: pointer;
}

#music_char span.active, #music_char span.busy:hover {
    color: #FFF;
}

/***** SITEMAP *****/

#sitemap {
    font-size: 10px;
    color: #657280;
    background: #C0CAD4;
    border: 1px solid #657280;
}

#sitemap a {
    color: #657280;
}

#sitemap .col {
    width: 313px;
    padding: 0 3px 10px 3px;
    float: left;
    position: relative;
    top: -10px;
}

#sitemap h3 {
    font-size: 12px;
    padding: 2px 0;
    margin-bottom: 8px;
    border: 1px solid #657280;
    border-left-width: 0;
    border-right-width: 0;
}

#sitemap h3 a {
    text-transform: uppercase;
    padding-left: 23px;
}

#sitemap ul.second {
    margin-left: 6px;
}

#sitemap ul {
    list-style: none;
    padding: 0;
}

#sitemap li.first {
    padding: 0 0 6px 0;
}

#sitemap li {
    padding-left: 10px;
}

#sitemap ul.second li.second {
    padding-left: 23px;
}

#sitemap img {
    position: relative;
    left: -45px;
    float: left;
}

/***** Product Amounts *****/

table.prodamount {
    margin-bottom: 19px;
    min-width: 365px;
}

table.prodamount th {
    line-height: 22px;
}

table.prodamount th, table.prodamount td {
    font-weight: normal;
    text-align: right;
    width: 110px;
}

table.prodamount th:first-child, table.prodamount td:first-child {
    text-align: left;
    width: 175px;
}

table.prodamount thead th {
    font-style: italic;
}

/***** BASKET *****/

.basket {
    font-size: 12px;
}

.basket .head, .basket .head ul li {
    background: var(--vsl-midblue);
}

.basket .head {
    height: 26px;
    border-bottom: 1px solid var(--v-hr-color);
    padding-top: 2px;
}

.basket .foot {
    min-height: 27px;
    background-color: var(--v-nav-frag-color);
    border-top: 1px solid var(--v-hr-color);
    border-radius: 0;
    padding: 10px 0 10px 0;
}

.basket .foot .hint {
    color: var(--v-secundary-text);
    padding: 8px 0 8px 15px;
}

.basket .head ul {
    margin: 0;
    padding: 2px 0 0 15px;
    position: relative;
    list-style: none;
    height: 20px;
}

.basket .head ul li {
    display: inline;
    text-transform: uppercase;
    color: var(--vsl-secundary-grey);
    padding: 0 4px;
    position: absolute;
}

.basket .head ul li.active {
    color: var(--vsl-cream2);
    font-weight: 600;
}

.basket .head ul li:first-child {
    padding-left: 0;
}

.basket .content_bright {
    padding: 10px 0 10px 15px;
}

.basket .content_bright .price {
    font-weight: bold;
}

.basket .content_bright ul {
    padding-left: 15px;
}

.basket .content_bright ul li:first-child {
    padding-bottom: 8px;
}

.basket .payment_verification {
    font-size: 13px;
}
.basket .payment_verification .order {
    margin: 20px 20px 30px 0;
}

.basket .payment_verification .content_bright {
    padding: 10px 15px 0 15px;
}

.basket .payment_verification .content_bright p {
    margin-bottom: 10px;
}

.basket .payment_verification .content {
    background-color: initial;
    color: var(--vsl-midprocessblue);
}

.basket .payment_verification .content .ac_list th {
    background-color: initial;
    color: var(--vsl-processblue);
    border: none;
}

.basket hr {
    border-width: 0;
    margin: -14px 0 0 0;
    background-color: var(--v-hr-color);
    height: 1px;
}

.basket .content .order {
    padding: 8px 0 8px 15px;
}

.basket .content .body {
    padding: 10px 0 10px 15px;
}

.basket .content .body.payment {
    padding-bottom: 0;
    padding-right: 15px;
}

.basket .content .body.payment .checkbox_container {
    width: 100%;
}

.basket .content {
    color: var(--v-primary-text);
    background-color: var(--v-content-bgd-color);
}

.basket .content table td, .basket .content table th {
    line-height: 13px;
    padding: 3px 10px 0 0px;
}

.basket .content table td:first-child, .basket .content table th:first-child, .basket .order_comment, .basket .addr, .basket .error_block {
    padding-left: 15px;
}

.basket #bask_buttons .error_block {
    padding-left: 0;
}

.basket .content table th {
    font-size: 10px;
    font-weight: normal;
    line-height: 19px;
}

.basket .content table tr.spliter {
    height: inherit;
}

.basket .content table tr.total td, .basket .content table tr.subtotal td {
    padding-top: 5px;
}

.basket .content table tr.spliter td {
    padding: 5px 0;
}

.basket .content table tr.spliter.tophalf td {
    padding: 5px 0 0 0;
}

.basket .content table td.currency {
    font-family: "Eurostile";
    font-weight: normal;
    padding-left: 10px;
    padding-right: 5px;
}

.basket .content table tr.spliter .spliter_line {
    display: block;
    background-color: #6E7A87;
    height: 1px;
}

.basket .content .product {
    width: 100%;
}

.basket .content th.product span {
    float: right;
}

.basket .content .delete, .basket2 .delete {
    background: url("./svg/w-close.svg") 0px center no-repeat;
    cursor: pointer;
    min-width: 13px;
    filter: brightness(var(--v-icon-brightness, 0.2));
}

.basket .content .delete:hover, .basket2 .delete:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.basket .content table .promo {
    padding: 10px;
}

.basket .content table .promo .submit {
    margin: 5px 15px;
}

.basket .promo_code {
    width: 210px;
    margin-left: 10px;
}

.basket .order_comment textarea {
    height: 55px;
    width: 440px;
    margin-top: 15px;
}

.basket .studentprice {
    color: var(--vsl-orange);
}

.basket tr#preliminary_total {
    font-size: 13px;
    font-weight: 600;
    color: var(--vsl-processblue);
}

.basket a.uncover.usdinfo {
    color: var(--v-primary-text);
    font-weight: normal;
    font-size: 12px;
}
.basket a.uncover.usdinfo:hover {
    color: var(--v-primary-text-highlight);
}

.basket .fr img[name="ss_imgTag"] {
    filter: brightness(var(--v-icon-brightness));
}

.vsl_upload_block .vsl_upload {
    display: inline-block;
    color: #657280;
    background: #dce1e4;
    font-size: 11px;
}
.vsl_upload_block .vsl_upload:hover {
    color: #374350;
    background: #e5e9ec;
}
.vsl_upload_block input.fname {
    width: 290px;
    margin-right: 15px;
    outline: none;
}

.vsl_upload_block .progress-animated {
    display: none;
}

.vsl_upload_block .progress-animated.active {
    display: inline-block;
    width: 290px;
    border: 1px solid grey;
}

.vsl_upload_block .progress-animated .progress-bar {
    height: 11px;
}

.edu .studentId_fileupload_upload {
    display: inline-block;
}

.edu .studentId_fileupload_upload {
    margin-top: 8px;
    padding: 1px 8px;
    cursor: pointer;
    color: #657280;
    background: #dce1e4;
}

.edu .studentId_fileupload_upload:hover {
    color: #374350;
    background: #e5e9ec;
}

.edu .progress-animated {
    display: none;
}

.edu .progress-animated.active {
    display: inline-block;
    width: 465px;
    border: 1px solid grey;
}

.edu .progress-animated .progress-bar {
    height: 11px;
}

#studentId_files span {
    display: block;
    font-size: 11px;
    color: #A1B0D2;
    margin-top: 5px;
}

#studentId_files span.text-danger {
    color: red;
}

#studentId_files #sid_file_for_up_exists_marker input {
    width: 450px;
    margin-right: 15px;
    outline: none;
}

.student_upload span.fileinput-button.submit {
    margin-left: 0px;
    margin-top: 2px;
}

.basket .dark {
    background-color: var(--vsl-midblue);
    color: var(--vsl-cream2);
}

.basket .total {
    font-weight: bold;
}

.basket .addr {
    margin: 10px 5px 5px 0;
    float: left;
    min-width: 340px;
}

.basket .addr span {
    margin-bottom: 10px;
    display: block;
}

.basket .cards {
    padding: 10px 0;
    position: relative;
}

.basket .cards img {
    height: 26px;
}

.basket .cards img.paypal, .basket .cards img.applepay {
    padding-right: 15px;
}

.basket .cards img.alipay {
    padding-right: 15px;
    width: 62px;
}

.basket .cards .secpay {
    position: absolute;
    left: 296px;
    top: 8px;
    line-height: initial;
}

.basket .agree {
    padding: 8px 116px 8px 15px;
}

.userconfirm .agree {
    padding: 8px 15px 8px 0px;
}

.basket .agree .checkbox_container, .userconfirm .agree .checkbox_container, .basket .agree .checkbox_container span, .userconfirm .agree .checkbox_container span {
    display: inline-block;
}

.basket #shippingcost td {
    padding-top: 10px;
    padding-bottom: 10px;
}

.basket #preliminary_total td, .basket #special_discount td {
    padding-bottom: 35px;
    padding-top: 10px;
}

.basket .content table .rule_fulfillinfo td {
    padding: 0 0 10px 15px;
    color: #0086CD;
}

.basket .content table .vk_hint {
    padding-bottom: 10px;
}

.basket .content table .hardware {
    padding-top: 0;
}

.basket .content table .hardware .btn {
    margin: 0 4px 4px 0;
    display: inline-block;
}

.basket .content table .hardware .btn a {
    position: relative;
    font-size: 10px;
    color: var(--vsl-cream2);
    text-decoration: none;
    height: 16px;
    line-height: 16px;
    padding: 1px 8px;
    border: 1px solid #657280;
    text-align: center;
    text-transform: uppercase;
    background: var(--vsl-processblue);
    text-shadow: none;
    -webkit-text-shadow: none;
    font-weight: normal;
    font-family: inherit;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.basket .content table .hardware .btn a:hover {
    background: var(--vsl-midprocessblue);
}

.basket .content a.info, .basket2 a.info {
    padding-left: 16px;
    margin-left: 10px;
    background: url("./svg/w-info-square.svg") left center no-repeat;
    filter: brightness(var(--v-icon-brightness, 0.2));
    background-size: 13px;
}

.basket .content a.info:hover, .basket2 a.info:hover {
    cursor: pointer;
    filter: brightness(var(--v-icon-brightness-hover, 0.4));
}

.basket .content table.ac_list td {
    line-height: 17px;
    min-height: 10px;
}

.basket .hints {
    margin: 20px;
}

.basket .hints span {
    width: 20px;
    display: inline-block;
}

.basket .hints.payment, .basket .hints.address {
    text-indent: -10px;
}

.editaddress {
    text-align: initial;
}

.editaddress input, .editaddress select {
    width: 406px;
    border-radius: initial;
    border: 1px solid #ADB9C4;
}

.editaddress input {
    padding: 2px 5px;
}

.editaddress select {
    padding-left: 2px;
    margin: initial;
}

.editaddress label {
    white-space: nowrap;
}

.editaddress .hints {
    margin: 10px 0 0 0;
}

.editaddress .hints span {
    width: 20px;
    display: inline-block;
}

.basket2 .form-row, .basket2 .row {
    display: flex;
    flex-wrap: wrap;
    line-height: 1.25rem;
}

.basket2 .form-row > .col, .basket2 .form-row > [class*=col-] {
    padding-right: 5px;
    padding-left: 5px;
}

.basket2 .form-row > .col:first-child, .basket2 .form-row > [class*=col-]:first-child {
    padding-left: 0;
}

.basket2 .form-row > .col:last-child, .basket2 .form-row > [class*=col-]:last-child {
    padding-right: 0;
}

.basket2 input.form-control-sm {
    font-size: 0.75rem
}

.basket2 .col, .basket2 .col-1, .basket2 .col-2, .basket2 .col-3, .basket2 .col-4, .basket2 .col-5, .basket2 .col-6,
.basket2 .col-7, .basket2 .col-8, .basket2 .col-9, .basket2 .col-10, .basket2 .col-11, .basket2 .col-12 {
    padding-left: 15px;
    padding-right: 15px;
}

.basket2 .text-primary {
    color: var(--vsl-processblue, #0086cd) !important;
}

.basket2 .text-body {
    color: #7F8080 !important;
}

.basket2 .bg-body {
    background-color: transparent !important;
}

.basket2 .mb-3125 {
    margin-bottom: 1.0625rem !important;
}

.basket2 .me-35 {
    margin-right: 1.25rem !important;
}

.basket2 .mb-35 {
    margin-bottom: 1.25rem !important;
}

.basket2 .mt-35 {
    margin-top: 1.25rem !important;
}

.basket2 .my-35 {
    margin-top: 1.25rem !important;
    margin-bottom: 1.25rem !important;
}

.basket2 .mb-45 {
    margin-bottom: 2rem !important;
}

.basket2 .my-45 {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
}

.basket2 .useraddress.form-row > .col, .basket2 .useraddress.form-row > [class*=col-] {
    padding-right: 0;
    padding-left: 0;
}

.basket2 .remembercarddata .form-row > .col, .basket2 .remembercarddata .form-row > [class*=col-] {
    padding-right: 0;
    padding-left: 0;
}

.basket2 .col-auto {
    min-width: max-content;
}

.basket2 .hoverable .form-row:hover {
    background-color: var(--v-scroll-bgd, #e0e0e0);
}

.basket2 .checkbox {
    background-position: 0 center !important;
}

.basket2 .payment .checkbox, .basket2 .remembercarddata > div {
    margin-left: 50px;
}

.basket2 .payment .payment_radio.checkbox {
    margin: 8px 110px 8px 35px;
}

.basket2 .payment.form-row img {
    height: 26px;
}

.basket2 .priceval {
    flex-basis: 6.75rem;
    margin-left: 1rem;
}

.priceval.nettovat {
    font-size: 13px;
}

.basket2 .voucher_code, .basket2 .promo_code {
    height: 20px;
    min-height: 20px;
}

.basket2 .hideable.form-row {
    display: none;
}

.basket2 .hideable.block.form-row {
    display: block;
}

.fs-475 {
    font-size: 1.3125rem!important; /*21px*/
}

/* need for fancybox because it is not under .basket2 */
.btn2 {
    font-size: 1.5rem;
    font-weight: bold;
    color: #FEFFFF !important;
    background-color: var(--vsl-processblue, #0086cd);
    border: none;
    padding: 1px 28px;
    text-transform: uppercase;
    vertical-align: middle;
}

.basket2 button.btn_load_wishlist:first-of-type {
    padding-left: 0;
    outline: none;
}

.basket2 button.btn_load_wishlist {
    font-size: 0.875rem;
}

.basket2 .btn_store_wishlist {
    padding-left: 0;
    outline: none;
    font-size: 0.875rem;
}

.basket2 button {
    color: var(--v-primary-text, #212121);
}

.basket2 button:hover {
    color: var(--v-primary-text-highlight);
    border-color: transparent;
}

.basket2 .btn2.disabled {
    background-color: #7f8080;
}

.basket2 .steps {
    font-size: 0.8rem;
    padding: 0;
    border: thin solid var(--vsl-processblue, #0086cd);
    white-space: nowrap;
}

.basket2 .steps li {
    color: var(--vsl-processblue, #0086cd);
    height: 1.25rem;
    width: 14.313rem;
    margin: 0 0.438rem;
    display: inline-block;
    position: relative;
    text-transform: uppercase;
    text-align: center;
    background-color: inherit;
}

.basket2 .steps li:first-child {
    margin-left: 0;
}

.basket2 .steps li:last-child {
    margin-right: 0;
}

.basket2 .steps li:not(:first-child) span:before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.625rem 0.188rem 0.625rem 0.438rem;
    border-color: transparent;
    left: -0.625rem;
}

.basket2 .steps li:not(:last-child) span:after {
    content: "";
    position: absolute;
    z-index: 2;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.625rem 0.188rem 0.625rem 0.438rem;
    border-color: transparent;
    right: -0.625rem;
}

.basket2 .steps li.inv.active {
    font-weight: bold;
}

.basket2 .steps li.inv {
    color: #FEFFFF;
    background-color: var(--vsl-processblue, #0086cd);
}

.basket2 .steps li.inv span:before {
    border-color: var(--vsl-processblue, #0086cd) var(--vsl-processblue, #0086cd) var(--vsl-processblue, #0086cd) transparent;
}

.basket2 .steps li.inv span:after {
    border-color: transparent transparent transparent var(--vsl-processblue, #0086cd);
}

.basket2 .steps li span a {
    color: inherit;
}

.basket2 .content td {
    padding: 0 0.5rem 0 0;
}

.basket2 .content th {
    white-space: nowrap;
    padding: 0 0.625rem 0 0;
    font-weight: inherit;
}

.basket2 .content thead tr {
    color: var(--vsl-processblue, #0086cd);
}

.basket2 .content thead .product {
    font-size: 1.5rem;
    text-transform: uppercase;
    font-weight: bold;
}

.basket2 .content thead .product span {
    font-size: 1.125rem;
    float: right;
    text-transform: initial;
    font-weight: initial;
}

.basket2 .content tbody tr {
    line-height: 2.25rem;
}

.basket2 .content td.currency {
    padding-left: 0.625rem;
    padding-right: 0.313rem;
}

.basket2 .content tr.spliter td {
    padding: 1.5rem 0 0.5rem 0;
}

.basket2 .content tr.spliter .spliter_line {
    display: block;
    background-color: #7F8080;
    height: 1px;
}

.basket2 .content .product {
    width: 100%;
}

.basket2 .delete, .basket2 .deleteplaceholder {
    flex-basis: 20px;
}

.basket2 .content .hw {
    color: #7F8080;
}

.basket2 .content .hw .desc {
    font-size: 1rem;
    margin-top: -1rem;
}

.basket2 .content .acode_tbl {
    width: 100%;
    font-size: 1rem;
}

.basket2 .content .acode_tbl th {
    font-size: 1rem;
}

.basket2 .your_price {
    color: #5A5B5B;
    font-weight: bold;
}

.basket2 .borderbtn {
    width: 80px;
    height: 20px;
    border: 1px solid #7F8080;
    background-color: transparent !important;
    filter: brightness(var(--v-icon-brightness, 0.2));
}

.basket2 a.usdinfo {
    color: var(--vsl-processblue, #0086cd);
}

.basket2 .maintenance {
    color: #FEFFFF;
    background-color: var(--vsl-processblue, #0086cd);
    font-weight: bold;
    text-align: center;
}

.basket2 .comment {
    display: inline-block;
    vertical-align: text-top;
    margin: 0 0 0 15px;
}

.basket2 .cb_label.behind {
    margin: 8px 0;
}

.basket2 .payment .cb_label.behind {
    margin-left: 25px;
    position: relative;
}

.basket2 .payment .cb_label.behind img {
    position: absolute;
    height: 26px;
    left: 140px;
    vertical-align: middle;
}

.basket2 .payment .cb_label.behind img.alipay {
    width: 62px;
}

.basket2 .foot {
    margin: 50px 0 0 0;
}

.basket2 .secpay {
    position: absolute;
    right: 0;
    width: 400px;
    text-align: justify;
}

.basket2 input {
    padding: 2px 5px;
    color: inherit;
    border-color: initial;
    border-radius: initial;
    background: initial;
    font-size: initial;
    vertical-align: middle;
}

.basket2 textarea {
    font-size: initial;
    border-radius: 0;
}

.basket2 .g2dwl {
    cursor: pointer;
}

.basket2 input:focus, .basket2 textarea:focus, .basket2 select:focus, .basket2 button:focus {
    outline: none;
}

.basket2 input::placeholder, .basket2 textarea::placeholder {
    color: inherit;
    opacity: 1;
}

.basket2 input:-internal-autofill-selected {
    outline: auto;
}

.ac_list {
    width: 100%;
}

.ac_list th {
    background-color: #031D34;
    color: #C0CAD4;
    font-size: 9px;
    font-weight: normal;
    padding: 12px 0 6px 5px;
    border-top: 1px solid #6E7A87;
    border-bottom: 1px solid #6E7A87;
}

.ac_list th:first-child {
    padding-left: 15px;
}

.ac_list tr.flat {
    height: 10px;
}

label.cb_label.behind {
    cursor: pointer;
}

.cb_label.behind.fl {
    margin-right: 30px;
}

label.cb_label.behind:last-of-type {
    margin-right: 0;
}

fieldset .cb_label.behind.fl {
    margin-right: 0px;
    min-width: 184px;
}

fieldset span.checkbox.bright {
    margin-left: 11px;
}

fieldset span.checkbox.bright:first-of-type {
    margin-left: 0;
}

.hwinfo {
    max-width: 450px;
}

.hwinfo span {
    font-style: italic;
}

/***** USERPROFILE / MYDOWNLOADS / MYPRODUCTS / PRODREG / MYWISHLISTS *****/

#userprofile .hints span {
    width: 20px;
    display: inline-block;
}

.mypage .foldable {
    background-color: var(--v-breadcrumb-color);
    color: var(--v-primary-text);
    padding: 0;
}

#profile_body #User_Gender {
    margin-right: 0;
}

#profile_body #User_PreferredLanguage {
    margin-right: 13px;
}

#profile_body input:disabled {
    color: var(--v-secundary-text-highlight);
}

.mypage .foldable .head {
    position: relative;
    line-height: 28px;
    margin: auto 0;
}

#mydownloads .head, #myproducts .foldable .head {
    padding-left: 15px;
}

.mypage .foldable .head .hotspot_foldable {
    position: absolute;
    cursor: pointer;
    top: 8px;
    right: 5px;
    width: 11px;
    height: 11px;
    background: url("./images/fold_bright_n_i.png") center center no-repeat;
}

.mypage .foldable .head .hotspot_foldable:hover {
    background: url("./images/fold_bright_n_a.png") center center no-repeat;
}

.mypage .foldable.open .head .hotspot_foldable {
    background: url("./images/collapse_bright_n_i.png") center center no-repeat;
}

.mypage .foldable.open .head .hotspot_foldable:hover {
    background: url("./images/collapse_bright_n_a.png") center center no-repeat;
}

.mypage .foldable .body, #myproducts .foldable .foot {
    background-color: var(--v-content-bgd-color);
}

.basket .content .body input, .basket .content .body select, #mysettings textarea, #mysettings input, #mysettings select, #userprofile textarea, #userprofile input, #userprofile select {
    float: left;
    width: 320px;
    margin: 3px 15px 3px 0;
    line-height: 12px;
}

#userprofile input:disabled {
    background-color: var(--vsl-cream1);
}

.basket .content .body .checkbox_container, .basket .content .body span, .mypage .foldable .body .checkbox_container, .mypage .foldable .body span {
    float: left;
}

.mypage .foldable.open .body {
    display: block;
}

.mypage .foldable.open .body .checkbox_container.first {
    padding-left: 15px;
}

#mydownloads #product_sel {
    margin-left: 15px;
}

.basket .content .body select, .basket .content .body select.c2 {
    width: 320px;
}

#mydownloads .body select.c2 {
    width: 334px;
}

.basket .content .body input.c3 {
    width: 203px;
}

.basket .content .body select.c3 {
    width: 220px;
}

.profile {
    color: #C0CAD4;
    background-color: #16364D;
    padding: 10px 0 10px 15px;
}

.profile input.c2 {
    width: 320px;
    margin: 3px 15px 3px 0;
}

.profile select.c2 {
    width: 337px;
    margin: 3px 15px 3px 0;
}

#mydownloads .body select.c3 {
    width: 217px;
    margin-bottom: 4px;
    margin-top: 4px;
}

.basket .content .body input.c4, #mydownloads .body input.c4 {
    width: 144px;
}

.basket .content .body select.c4 {
    width: 161px;
}

#mydownloads .body select.c4 {
    width: 158px;
}

.mypage .foldable hr {
    border-width: 0;
    margin: 0;
    background-color: #667783;
    height: 1px;
}

.mypage .checkbox_container {
    line-height: 29px;
    outline: none;
}

.mypage .checkbox_container .checkbox {
    min-height: 20px;
}

#myproducts .foot {
    padding-left: 15px;
    line-height: 29px;
}

#myproducts .body .checkbox_container span {
    margin-left: 15px;
}

#myproducts .foldable .head, #myproducts .foldable .foot {
    color: var(--v-secundary-text);
}

#mydownloads .head.dlm, #ilokreg div.submit {
    background-color: var(--vsl-green);
}

#ilokreg div.submit:hover {
    background-color: var(--vsl-midgreen);
}

.ilok_legend {
    width: 8px;
    height: 8px;
    background: url("./svg/w-circle-fill.svg") center center no-repeat;
}

.ilok_legend.not_convertible {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(0deg) brightness(1.65);
}

.ilok_legend.not_yet_converted {
    filter: brightness(0.5) sepia(1) saturate(7000%) hue-rotate(48deg) brightness(1.89);
}

.ilok_legend.deposited {
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(115deg) brightness(1.65);
}

#mydownloads .head .checkbox_container {
    display: inline-flex;
}

#myproducts .foldable .foot span {
    line-height: inherit;
}

#myproducts .content hr {
    border-width: 0;
    margin: 0;
    background-color: #A7B5BE;
    height: 1px;
}

#myproducts .mp_prod {
    padding-top: 5px;
}

#myproducts .mp_prod span {
    padding-right: 15px;
}

#myproducts .mp_prod select {
    margin: 0;
    padding-top: 1px;
}

#myproducts .checkbox_container.c3 {
    width: 226px;
}

#myproducts .checkbox_container.c3.d-inline-flex {
    width: 223px;
}

#prodreg.mypage .foldable .body {
    background: none;
    color: #676666;
    padding: 10px 0;
}

#prodreg.mypage .foldable {
    background: none;
    border: none;
}

#prodreg.mypage .foldable .head {
    background-color: #031D34;
}

#prodreg.mypage .foldable .body span {
    float: none;
}

#prodreg.mypage .foldable .body .checkbox_container span {
    float: left;
}

.checkresult {
    color: var(--v-highlight-red);
}

#prodreg input.serial, #keyreg input.serial, #keyreport input.serial, #ilokreg input.serial {
    width: 260px;
    margin-right: 10px;
    border: 1px solid #aec0ca;
    background: #f3f3f2;
    color: #657280;
    padding: 2px 4px;
    font-size: 13px;
}

#prodreg #check_serial:disabled {
    opacity: 0.3;
}

#prodreg #check_serial:disabled:hover {
    cursor: default;
}

.activationcode {
    border: 1px solid #aec0ca;
    width: 375px;
    padding: 2px 4px;
    margin: 4px 0 19px 0;
}

#mysettings .submit,
#userprofile .submit,
#prodreg .submit,
#keyreg .submit,
#keyreport .submit,
#ilokreg .submit {
    margin: 5px 0 5px 8px;
    background-color: var(--vsl-processblue);
    color: var(--vsl-cream2);
    cursor: pointer;
}
#ilokreg .submit.disabled, #ilokreg .submit.disabled:hover {
    background-color: var(--v-disabled-bgd);
}
#mysettings .submit:hover,
#userprofile .submit:hover,
#prodreg .submit:hover,
#keyreg .submit:hover,
#keyreport .submit:hover,
#ilokreg .submit:hover {
    background-color: var(--vsl-midblue);
}
#mysettings .submit input,
#prodreg .submit input,
#keyreg .submit input,
#keyreport .submit input,
#ilokreg .submit input,
#mysettings .submit button,
#userprofile .submit button,
#prodreg .submit button,
#keyreg .submit button,
#keyreport .submit button,
#ilokreg .submit button {
    color: var(--vsl-cream2);
}
#mysettings .submit:hover input,
#prodreg .submit:hover input,
#keyreg .submit:hover input,
#keyreport .submit:hover input,
#ilokreg .submit:hover input,
#mysettings .submit:hover button,
#userprofile .submit:hover button,
#prodreg .submit:hover button,
#keyreg .submit:hover button,
#keyreport .submit:hover button,
#ilokreg .submit:hover button {
    color: var(--vsl-cream2);
}

#keyreg input.serial.half {
    width: 140px;
}

#keyreg input.serial.half.first {
    margin-right: 0px;
}

#keyreport input.serial {
    width: 380px;
    margin-right: 0;
}

#keyreport select {
    width: 95px;
    margin-right: 10px;
}

#mywishes.mypage .body {
    padding: 10px 0 10px 15px;
}

tr.dwl_tr {
    background-color: var(--v-content-bgd-color);
}

.dl_list {
    width: 100%;
}

.dl_list th {
    background-color: var(--vsl-midblue);
    color: var(--vsl-cream2);
    font-size: 11px;
    font-weight: normal;
    padding: 12px 0 6px 5px;
    border-bottom: 1px solid var(--vsl-secundary-grey)
}

.dl_list th.dl_sort {
    padding-left: 15px;
}

.dl_list th.dl_sort span:hover, .dl_list th.dl_date.hover {
    color: var(--v-primary-text);
    cursor: pointer;
}

.dl_list th.dl_sort span.active {
    color: var(--vsl-cream2);
    cursor: inherit;
}

.dl_list td {
    border-bottom: 1px solid var(--v-secundary-border);
    line-height: 23px;
    padding: 3px 0 3px 5px;
    vertical-align: top;
}

.dl_list td.dl_size {
    width: 65px;
    text-align: right;
}

.dl_list th.dl_size {
    text-align: center;
}

.dl_list .dl_date {
    width: 110px;
    padding-left: 15px;
    white-space: nowrap;
}

.dl_list th.dl_date {
    text-align: center;
    padding-right: 24px;
}

.dl_list th.dl_date:hover {
    color: #fff;
    cursor: pointer;
}

.dl_list th.dl_date.active {
    color: #fff;
}

.dl_list th.dl_date.active span {
    width: 0px;
    height: 0px;
    display: inline-block;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #fff;
    border-top: 0px solid #fff;
    margin: 0px 0px 1px 10px;
}

.dl_list th.dl_date.active.reverse span {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 0px solid #fff;
    border-top: 6px solid #fff;
    margin: 1px 0px 0px 10px;
}

.dl_list .description {
    width: 485px;
    border-right: 1px solid var(--v-secundary-border);
    padding-left: 8px;
}

.dl_list .dwl {
    height: 13px;
    display: block;
    width: 20px;
    margin-top: 1px;
}

.dl_list tr.headline th {
    font-size: 14px;
    background-color: var(--vsl-midblue);
    color: var(--vsl-cream2);
    border-right-width: 0;
    padding-top: 6px;
}

.dl_list tbody tr.dwl_tr:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
    cursor: pointer;
}

.edu_list {
    width: 100%;
    margin-top: 20px;
    font-size: 0.8em;
}

.edu_list th {
    background-color: #031D34;
    color: #C0CAD4;
    font-weight: normal;
    padding: 9px 0 9px 5px;
}

.edu_list td {
    border-bottom: 1px solid #A7B5BE;
    line-height: 23px;
    padding: 3px 0 3px 5px;
    vertical-align: top;
}

.edu_list .edu_state {
    width: 135px;
    text-align: center;
    border-right: 1px solid #A7B5BE;
}

.edu_list .description {
    width: 430px;
    border-right: 1px solid #A7B5BE;
    padding-left: 15px;
}

.edu_list .dwl {
    height: 13px;
    display: block;
    width: 11px;
    margin-top: 4px;
}

.edu_list tbody tr.edu_tr:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
    cursor: pointer;
}

.edu_list th.edu_date {
    text-align: center;
    padding-right: 24px;
}

.edu_list .edu_date {
    width: 80px;
    padding-left: 15px;
    white-space: nowrap;
}

.mp_list {
    width: 100%;
    white-space: nowrap;
}

.mp_list th {
    font-weight: normal;
    padding: 5px 0 5px 15px;
}

.mp_list .description.euro {
    padding: 6px 0 6px 15px;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mp_list .d-flex .description.euro {
    max-width: none;
}

.mp_list .description.euro span {
    padding-left: 30px;
    display: inline-block;
    white-space: normal;
    font-family: GothicMT, Arial, Helvetica, Verdana, sans-serif;
}

.mp_list .description.news11 {
    border-top: 1px solid #A7B5BE;
}

.mp_list td, .mo_list td {
    padding-left: 15px;
}

.mp_list th.mp_serial {
    width: 180px;
}

.mp_list td.mp_serial {
    width: 165px;
    padding-left: 4px;
}

.mp_list .mp_date {
    width: 110px;
}

.mp_list .mp_date {
    padding-right: 15px;
    padding-left: 0px;
    text-align: right;
}

.mp_list tbody tr:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

.mp_list td.mp_noinfo {
    width: 11px;
    padding-left: 0;
}

.mp_list .mp_info {
    width: 11px;
    background: url("./svg/w-info-square.svg") center no-repeat;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.35);
    padding: 0 0 0 21px;
}

.mp_list .mp_info:hover {
    cursor: pointer;
    filter: brightness(0.5) sepia(1) saturate(10000%) hue-rotate(193deg) brightness(1.65);
}

.ac_tbl {
    line-height: 22px;
}

.ac_name {
    width: 140px;
    text-align: left;
}

.ac_value {
    text-align: left;
    white-space: nowrap;
}

.mo_list, .wishtbl {
    width: 100%;
    white-space: nowrap;
}

.mo_list th {
    font-weight: normal;
    padding: 6px 0 8px 15px;
}

.wishtbl th {
    padding: 6px 0 8px 15px;
}

.wishtbl th.wish_action {
    padding: 0;
}

.mypage .mo_list.foldable, .mypage .wishtbl.foldable {
    color: inherit;
    background-color: inherit;
    border-width: 0 0 1px 0;
}

.mo_list .mo_fold, .wishtbl .wish_fold {
    width: 30px;
    padding: 0;
}

.mo_list .mo_id {
    width: 160px;
    padding-left: 0;
}

.wishtbl .wish_id {
    width: 155px;
    padding-left: 0;
}

.mo_list .mo_date {
    width: 200px;
}

.wishtbl .wish_date {
    width: 70px;
}

.mo_list .mo_dwl {
    padding-right: 15px;
}

.mo_list tr.headline th {
    font-size: 14px;
    color: var(--vsl-cream2);
    background-color: var(--vsl-processblue);
    border-right-width: 0;
    padding-top: 4px;
}

.mo_list tr:hover, .wishtbl tr:hover {
    background-color: var(--v-table-row-highlight, #e5e5e5);
}

.mo_list .mo_detail {
    padding-left: 0;
}

.mo_list .mo_prod {
    width: 375px;
    padding-left: 0;
}

.mo_list .mo_prod.mo_lic {
    width: 355px;
    padding-left: 20px;
}

.mo_list.foldable thead tr, .wishtbl.foldable thead tr {
    cursor: pointer;
}

.mo_list.foldable .mo_list thead tr, .wishtbl.foldable .wish_fold thead tr {
    cursor: default;
}

.mo_list.foldable th.mo_fold, .wishtbl.foldable th.wish_fold {
    background: url("./images/unfold_dark_n_i.png") center center no-repeat;
}

.mo_list.foldable th.mo_fold:hover, .wishtbl.foldable th.wish_fold:hover {
    background: url("./images/unfold_dark_n_a.png") center center no-repeat;
}

.mo_list.foldable tbody, .wishtbl.foldable tbody {
    display: none;
}

.mo_list.foldable.open th.mo_fold, .wishtbl.foldable.open th.wish_fold {
    background: url("./images/fold_dark_n_i.png") center center no-repeat;
}

.mo_list.foldable.open th.mo_fold:hover, .wishtbl.foldable.open th.wish_fold:hover {
    background: url("./images/fold_dark_n_a.png") center center no-repeat;
}

.mo_list.foldable.open tbody, .wishtbl.foldable.open tbody {
    display: table-row-group;
}

#myorders .hint {
    text-align: center;
    padding: 20px 30px;
}

#myorders .content {
    background-color: var(--v-content-bgd-color);
    color: var(--v-primary-text);
}

/***** NOTEGRAPH *****/
#noteGraph {
	filter: invert(var(--oacc-invert, 0.0));
}

#noteGraphButtons {
    position: relative;
    top: 10px;
    height: 35px;
}

.notegraph_button {
    position: absolute;
    left: 0;
    top: 0;
    width: 19px;
    height: 15px;
    margin: 0;
    background: url("./images/Academy_play_inactive.png") no-repeat;
}

.notegraph_button:hover {
    background: url("./images/Academy_play_active.png") no-repeat;
}

.notegraph_button.active {
    background: url("./images/Academy_pause_inactive.png") no-repeat;
}

.notegraph_button.active:hover {
    background: url("./images/Academy_pause_active.png") no-repeat;
}

.unauthed {
    background-color: #031D34;
    color: #C0CAD4;
    height: 30px;
    line-height: 30px;
    padding-left: 15px;
    vertical-align: middle;
}

.unauthed a {
    color: #A1B0D2;
}

.hideable {
    display: none;
}

.hideable.block {
    display: block;
}

cite {
    position: absolute;
    display: none;
    color: #009;
    background: #EEF;
    border: 1px solid #66F;
    padding: 10px;
    width: 320px;
    z-index: 90;
}

cite p {
    margin-bottom: 0;
    line-height: 15px;
}

cite .heading {
    font-weight: bold;
    display: inline-block;
    margin-bottom: 4px;
}

abbr {
    border-bottom: 1px dotted #00F;
    cursor: help;
}

/***** EXTERNAL PLAYER *****/

#extplayer {
    position: fixed;
    width: 100%;
    margin: 0;
    padding: 5px;
    overflow: hidden;
    background: var(--vsl-darkblue);
}

#extplayer .tracktbl tbody tr.active {
    background-color: var(--v-table-row-highlight);
}

#extplayer #player_head {
    position: relative;
    height: 60px;
    background: url("./svg/se-logo-text.svg") left top no-repeat;
    background-size: 200px;
}

#extplayer #player {
    position: static;
}

#extplayer #player_demo_browser {
    display: none;
    height: 100%;
    overflow-y: auto;
    color: var(--v-text-inverted);
}

#extplayer #player_footer {
    position: fixed;
    bottom: 5px;
    width: calc(100% - 10px);
    height: 25px;
}

#extplayer #player_footer ul {
    margin: 0;
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
    border-color: var(--vsl-midblue);
    background: var(--vsl-darkblue);
}

#extplayer #player_footer li {
    list-style: none;
    width: 25%;
    margin: 0;
    text-align: center;
    line-height: 25px;
    display: inline-block;
    color: var(--vsl-cream2);
    text-transform: uppercase;
    cursor: pointer;
    border: 1px solid var(--vsl-midblue);
    border-left-width: 0;
    text-shadow: none;
    -webkit-text-shadow: none;
    box-shadow: none;
    -webkit-box-shadow: none;
}

#extplayer #player_footer li:first-child {
    width: 25%;
    border-left-width: 1px;
}

#extplayer #player_footer li:hover {
    color: var(--vsl-cream2);
}

#extplayer .tracktbl .composer {
    width: 180px;
}

/* scrollbar */

#extplayer .scrollable {
    width: 100%;
    height: 100%;
}

#extplayer .pane {
    display: block;
    height: 100%;
    overflow: hidden;
    overflow-y: scroll;
    color: var(--v-primary-text);
    background-color: var(--v-content-bgd-color);
}

#extplayer .scrollbar {
    display: none !important;
    float: right;
    width: 20px;
    height: 100%;
    background: var(--vsl-darkblue);
}

#extplayer .handle>div {
    height: 100%;
    margin: 0 5px;
    border: 1px solid var(--vsl-midblue);
    background-color: #16364D;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

#extplayer .shown {
    display: block !important;
}

#extplayer #player_content {
    display: block;
    position: relative;
    height: 400px;
    border: 1px solid var(--vsl-midblue);
}

#extplayer #player_top {
    display: block;
    height: 200px;
    color: var(--vsl-cream2);
    background: var(--vsl-main-grey2);
}

#extplayer #player_top .scrollbar {
    border-left: 1px solid var(--vsl-midblue);
}

#extplayer #player_splitter {
    display: none;
    position: absolute;
    top: 200px;
    width: 100%;
    height: 5px;
    cursor: row-resize;
    z-index: 100;
    border: 1px solid var(--vsl-midblue);
    border-width: 1px 0;
    background: #16364D;
    overflow: visible;
}

#extplayer #player_splitter>.handle {
    position: absolute;
    right: 0px;
    top: 0;
    width: 20px;
    height: 5px;
    border: 1px var(--vsl-midblue) solid;
    border-width: 0 0 0 1px;
    background: #00233c;
    display: none;
}

#extplayer #player_bottom {
    display: none;
    position: absolute;
    bottom: 0;
    height: 200px;
    width: 481px;
    width: 100%;
}

/* wrapper */

#extplayer #player_demo_browser_wrap, #extplayer #player_playlist_browser_wrap {
    display: none;
}

#extplayer #player_demo_browser, #extplayer #player_playlist_browser {
    padding-left: 15px;
    position: relative;
}

/* playlist */

#extplayer #player_playlist {
    height: 100%;
    overflow-y: auto;
}

#extplayer #player_playlist tr.hotspot_detail td, #extplayer #player_playlist thead th {
    padding-top: 4px;
    padding-bottom: 4px;
}

#extplayer #player_playlist #pl_title {
    padding-left: 15px;
}

#extplayer #playlist_title_edit {
    display: block;
    padding: 0;
    margin: 0;
    border: 0;
    background: #417695;
    color: #fff;
    font-size: 11px;
}

#extplayer #playlist_title_edit:focus {
    outline: 0;
}

#extplayer #player_playlist>ul {
    list-style: none;
    padding-bottom: 1px;
}

#extplayer #player_playlist>ul>li {
    color: #c0cad4;
    border-bottom: 1px solid #4c6476;
    display: block;
}

#extplayer #player_playlist>ul>li.active {
    background: #417695;
    color: #fff;
}

#extplayer #player_playlist>ul>li>.head {
    padding: 5px 5px 5px 25px;
}

#extplayer #player_playlist ul>li>.info {
    padding: 5px;
    background: #c0cad4;
    color: #00233c;
    font-size: 9px;
    display: block;
}

#extplayer #player_playlist ul>li>.info ul {
    display: block;
    float: left;
    width: 20%;
    margin: 0;
    padding: 0;
    margin-top: 3px;
    vertical-align: top;
    list-style: none;
}

#extplayer #player_playlist ul>li>.info ul>li {
    padding: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
}

#extplayer span.title {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#extplayer .ui-sortable-helper .title {
    width: 254px;
}

#extplayer .mejs-controls {
    background: var(--vsl-main-grey2);
}

#extplayer #player_wrap {
    background: var(--vsl-darkblue);
    min-height: 30px;
}

#extplayer #player.me_container {
    display: none;
    border: 1px solid var(--vsl-midblue);
}

#extplayer .mejs-controls:focus {
    outline: none;
}

#extplayer .uline .nav {
    float: none;
}

#extplayer .uline>div {
    margin-left: 0;
}

#extplayer .tracktbl tbody .info {
    padding-left: 7px;
}

#extplayer #player_playlist .tracktbl .del, #extplayer #player_playlist #playlist_new {
    background: url("./svg/w-close.svg") 0px center no-repeat;
    cursor: pointer;
    min-width: 13px;
    filter: brightness(var(--v-icon-brightness, 0.2));
}

#extplayer #player_playlist .tracktbl .del:hover, #extplayer #player_playlist #playlist_new:hover {
    filter: brightness(var(--v-icon-brightness-hover, 0.8));
}

#extplayer #player_playlist #playlist_start {
    cursor: pointer;
}

#extplayer .tracktbl tbody tr.detail, #extplayer .tracktbl tbody tr.detail:hover {
    color: var(--v-primary-text);
    background-color: var(--v-content-bgd-color);
}

#extplayer .player_load_playlist {
    position: absolute;
    top: 15px;
    right: 15px;
    height: 11px;
    background: url("./images/fold_dark_n_i.png") left center no-repeat;
}

#extplayer .player_load_playlist:hover {
    background: url("./images/fold_dark_n_a.png") left center no-repeat;
}

#extplayer #player_playlist th.volume {
    text-align: right;
    padding-right: 10px;
}

#extplayer #player_playlist tr.hotspot_detail td.volume {
    padding: 0;
    border: none;
    width: 46px;
}

#extplayer .volume .ui-widget-content.ui-corner-all {
    border: none;
    outline: none;
    border-radius: 0;
    background: var(--v-bgd-color);
}

#extplayer tr:hover .volume .ui-widget-content.ui-corner-all {
    background: var(--v-bgd-color);
}

#extplayer tr.active .volume .ui-widget-content.ui-corner-all {
    background: var(--v-bgd-color);
    border-radius: 0;
}

#extplayer .volume .ui-widget-content.ui-corner-all .ui-corner-tr, #extplayer .volume .ui-widget-content.ui-corner-all .ui-corner-br {
    border: none;
    border-radius: 0;
}

#extplayer .spinner {
    width: 20px;
    padding: 0 4px;
    border: none;
    outline: none;
    margin: 0 12px 0 0;
    text-align: right;
    color: var(--v-primary-text);
    background: var(--v-bgd-color);
    font-size: 12px;
    font-family: GothicMT, Arial, Helvetica, Verdana, sans-serif;
}

#extplayer .spinner.ui-spinner-input {
    padding-bottom: 1px;
}

#extplayer .ui-spinner .ui-spinner-button {
    background-image: var(--vsl-spinner-bgimage);
}

#extplayer .ui-icon.ui-icon-triangle-1-n {
    background-position: 0 -12px;
    margin-top: -6px;
}

#extplayer .ui-icon.ui-icon-triangle-1-s {
    background-position: -65px -20px;
    margin-bottom: -6px;
}

/* SEARCH RESULT (used in YAF too) */

.sr_entry {
    color: var(--vsl-cream2);
    width: 100%;
    border-top: 1px solid var(--vsl-border-grey);
}

.sr_entry .head {
    background-color: var(--vsl-darkgrey);
    color: var(--vsl-cream2);
    padding: 3px 5px 3px 10px;
}

.sr_entry h3.head {
    margin: 0px;
}

#forum .sr_entry .head {
    padding: 3px 5px 3px 15px;
}

.sr_entry .head .news15 {
    display: block;
    padding-bottom: 6px;
}

.sr_entry a:hover {
    text-decoration: underline;
}

.sr_entry .head a {
    margin-left: 4px;
    color: #C0CAD4;
}

.sr_entry .body {
    padding: 8px 10px;
    background-color: var(--v-content-bgd-color);
    color: var(--v-primary-text);
}

.sr_entry .body a, #forum .sr_entry .body a {
    color: var(--v-link-color);
}

.sr_entry .url {
    padding: 3px 5px 3px 10px;
    display: inline-block;
}

.sr_group {
    font-size: 15px;
    line-height: 30px;
}

.fader {
    position: relative;
}

.fader .screen, .fader .blend {
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.fader .blend {
    position: absolute;
    top: 0;
    display: block;
}

.fader .jumperbar {
    position: absolute;
    bottom: 5px;
    width: 100%;
    z-index: 1000;
}

.fader .jumper {
    width: 100%;
    height: 20px;
    margin: 0 auto;
    text-align: center;
}

.fader .jumper a {
    display: inline-block;
    height: 18px;
    padding: 0 20px;
    background-image: url(./images/SSV_Landing_JumperEmpty.png);
    background-repeat: no-repeat;
    background-position: center;
}

.fader .jumper a.active, .fader .jumper a:hover {
    background-image: url(./images/SSV_Landing_JumperFull.png);
}

.top_search_input {
    width: 315px;
    padding: 0 3px 0 5px;
    height: 20px;
    line-height: 20px;
}

.loupe {
    width: 23px;
    background: url("./images/bg_search.png") no-repeat;
    padding: 0;
    margin: 0 0 0 -8px;
    height: 22px;
    cursor: pointer;
    outline: none;
}

.pager {
    padding: 10px 0;
}

.pager input {
    padding: 3px 6px 4px 5px;
    min-width: 28px;
}

.pager input:hover {
    cursor: pointer;
}

.pager input.active {
    color: #000;
    background: #D9DFE5;
}

.search2sub {
    height: 268px;
}

.search3sub {
    height: 237px;
}

.search_site {
    background: #CED5D9;
    border: 1px solid #A7B5BF;
    color: #657280;
    font-size: 11px;
}

.search_site div {
    text-align: center;
}

.search_site .search_input {
    width: 220px;
    padding: 0 5px;
    height: 20px;
    line-height: 20px;
    margin: 3px 4px 0 4px;
}

.search_site select {
    margin: 8px 0px 0px 0px;
    width: 180px;
}

.search_site .submit {
    margin: 8px 0px;
}

.search_site .submit input {
    margin: 4px 0;
    width: 60px;
    padding: 0;
}

.search_result {
    padding: 0 5px 8px 20px;
}

.search_result .hits {
    padding: 5px 0;
}

.search_result span.highlight {
    background-color: #325364;
    color: #FFF;
}

#cookie-alert {
    background: var(--vsl-darkgrey);
    color: var(--vsl-cream2, #f0f0f0);
    padding: 5px 0;
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 110;
    font-size: 0.9em;
}
#cookie-alert .checkbox_container {
    width: auto;
    margin-right: 45px;
}
#cookie-alert .btn {
    border-radius: 0 !important;
}
#cookie-alert .btn-group-vertical {
    margin-top: 20px;
}

#cookie-alert .alert {
    margin: 0 auto;
    width: 960px;
}

#cookie-alert .alert a {
    color: var(--vsl-cream2, #f0f0f0);
    text-decoration: underline;
}

#cookie-alert .checkbox_container {
    text-align: initial;
    outline: none;
    display: inline-block;
}

#cookie-alert .checkbox_container span {
    float: left;
}

#cookie-alert .checkbox_container .checkbox {
    filter: brightness(0.8);
}

#cookie-alert .checkbox_container.readonly .checkbox,
#cookie-alert .checkbox_container.readonly label {
    filter: brightness(0.6);
}

.bbetween {
    position: relative;
    height: 50px;
    color: #FFF;
    text-align: center;
    padding-bottom: 3px;
    min-width: 340px;
}

.bbetween .button {
    position: absolute;
    bottom: 0;
    right: 138px;
}

.bbetween a {
    color: #FFF !important;
}

/* download module */
.dwl_button {
    text-align: center;
}

.dwl_button p {
    font-size: 16px;
    line-height: 30px;
    color: var(--v-secundary-text);
    margin-bottom: 0;
}

.dwl_button button {
    font-size: 24px;
    font-weight: 700;
    color: #FFF;
    background-color: var(--vsl-processblue, #0086cd);
    width: 218px;
    height: 50px;
    margin: 10px;
    border: 0;
    padding: 0;
    margin-bottom: 19px;
    cursor: pointer;
}


/* Phils section BEGIN*/

.serviceinfo {
    font-family: monospace;
}

#serviceoutput {
    width: 98%;
    min-height: 500px;
}

/* Phils section END */

/* cm's section BEGIN */

.newsruler, .newsbhead, .newsbimgleft, .newsbimgright, .newsdiscl {
    width: 680px;
    position: relative;
    left: -20px;
    padding-left: 20px;
    padding-right: 20px;
}

.newsruler {
    border-top: 1px solid #657280;
    margin-bottom: 20px;
}

.newsbhead {
    height: 39px;
    border-top: 1px solid #657280;
    border-bottom: 1px solid #BECBD4;
    background-color: #E9EAEC;
}

.newsbhead p {
    font-size: 13px;
    margin: 12px 0;
}

.newsdiscl {
    height: 30px;
    border-top: 1px solid #657280;
    border-bottom: 1px solid #657280;
}

.newsdiscl p {
    font-size: 10px;
    text-align: center;
}

.newsimgleft, .newsimgright {
    margin-right: 20px;
}

.newsbimgleft, .newsbimgright {
    padding-bottom: 1px;
    background-color: #F1F2F4;
}

.newsimgleft img, .newsbimgleft img {
    float: left;
    margin: 0 20px 19px 0;
}

.newsimgright img, .newsbimgright img {
    float: right;
    margin: 0 0 19px 20px;
}

.newssalut {
    font-size: 20px;
    line-height: 30px;
    color: #666666;
    margin-top: 20px;
    margin-bottom: 10px;
}

.newsimgfull img {
    margin-left: 20px;
}

.newsletter p {
    font-size: 16px;
    line-height: 1.5em;
}

.newsletter h1 {
    font-size: 26px;
    line-height: 1.5em;
}

.newsletter h3 {
    font-size: 20px;
    line-height: 1.5em;
}

.news_button p, .addprod_button p, .addhw_button p, .download_button p {
    font-size: 16px;
    line-height: 30px;
    color: var(--v-secundary-text);
    text-align: center;
    margin-bottom: 0;
}

.news_button p {
    margin-top: 20px;
}

.news_button button, .addprod_button button, .addhw_button button, .download_button button {
    display: block;
    font-size: 28px;
    font-weight: 700;
    color: #FFF;
    background-color: #0086CD;
    width: 250px;
    height: 50px;
    border: 0;
    padding: 0;
    margin: auto;
    margin-bottom: 19px;
    cursor: pointer;
}

.addhw_button button {
    font-size: 16px !important;
    height: 30px !important;
    width: 150px !important;
}

.msg_header {
    margin-bottom: 10px;
    border: 1px solid #CCC;
}

.msg_header dl {
    margin: 0;
    padding: 10px;
}

.msg_header dt {
    clear: left;
    float: left;
}

.msg_body {
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 14px;
    background-color: #FFF;
}

/* cm's section END */