/* ==========================================================================================
   AATVENTURE WIRESHOP 30-07-2025
   user interface for the webshops layout
   ========================================================================================== */

@font-face {font-family: 'Myriad Regular';       src: url('../../fonts/MyriadPro-Regular.woff')            format('woff');}
@font-face {font-family: 'Roboto Regular';       src: url('../../fonts/Roboto-Regular.woff')               format('woff');  font-weight: 400;}
@font-face {font-family: 'Roboto Medium';        src: url('../../fonts/Roboto-Medium.woff')                format('woff');  font-weight: 400;}
@font-face {font-family: 'Jellee';               src: url('../../fonts/Jellee-Roman.woff2')                format('woff2'); font-style:normal; font-weight:400;}
@font-face {font-family: 'Buttery';              src: url('../../fonts/Buttery.woff2')                     format('woff2'); font-display: swap;} /* VANAF 1 KILO EN MOJITO */
@font-face {font-family: 'VeiligOpSlot';         src: url('../../fonts/VeiligOpSlot.woff2')                format('woff2')}
@font-face {font-family: 'FontAwesomeSolid';     src: url('../../fonts/fa-solid-900.woff2')                format('woff2'); font-weight:400; font-style:normal;}
@font-face {font-family: 'Glyphicons Halflings'; src: url('../../fonts/glyphicons-halflings-regular.woff') format('woff');  font-display: swap;}
 
@media screen and (min-width: 768px) {
    ::-webkit-scrollbar             {width: 12px !important;}
    ::-webkit-scrollbar-track-piece {background-color: #021924 !important;}
    ::-webkit-scrollbar-thumb       {background-color: #062d40 !important;}
}

.groupsbody        {width:100%; margin-top:-10px;}
.groupsbody-sushi  {background-color: rgb(17, 17, 17) !important;}
input::placeholder {color:#AAAAAA!important; opacity:0.8!important;}
.zindex190         {display:block; width:200px!important; height:35px!important; margin-top:-6px!important; margin-left:auto!important; margin-right:auto!important; border-radius:8px;}

.attributesprice                      {right: 134px !important;} /* popupitem fix! */
.body-slagerij-verstappen             {overflow: hidden;}
.body-slagerij-verstappen .se-pre-con {background: #090A10 !important;}

.dropdown-item .textshadow {display: inline-flex !important; flex-wrap: wrap; align-content: flex-end; justify-content: flex-start; align-items: flex-start; flex-direction: row;}

.productsbody                {overflow: hidden;}
.productsbody #maincontainer {margin-top: 69px !important;}
.weightshophelper            {width:100% !important;}

/* ==========================================================================
   xviewinput per listitemkind
   ========================================================================== */

.weightshop .xviewinput                           {appearance: none; border-width: 1px; padding: .5rem .75rem; line-height: 1.5rem;}
.weightshop .listitemkind-threeinarow .xviewinput {bottom: -6px !important; left: -2px !important;}
.weightshop .listitemkind-halfwidth   .xviewinput {bottom: -6px !important; left: -2px !important;}
.weightshop .listitemkind-portrait    .xviewinput {bottom: -1px !important; left: -5px !important;}
.weightshop .listitemkind-classic     .xviewinput {text-align: center !important; bottom: -3px !important; left: -27px !important; width: 93px !important; color: #000000; font-size: 27px !important;}

/* ==========================================================================
   weightshop.blade
   ========================================================================== */

#contact-postcode         {min-width:110px !important;}
#contact-huisnr           {min-width:1px !important;}
input::placeholder        {color: #AAAAAA !important; opacity: 0.8 !important;}
#warningtext              {padding-top: 50px; text-align: center; color: #ffb600;}
.clearboth                {clear:both;}
.showpointer              {cursor:pointer !important;}
.body-alle-producten .ovl {opacity:0 !important;}

/* ==========================================================================
   dark mode
   ========================================================================== */

.wirefilters     {position: absolute; top: 20px; left: 0px; width: 100%; z-index: 9999;}
.wiresearchinput {min-width:250px;}
.wiresortinput   {min-width:250px;}
[type=text]      {background: transparent !important;}
.text-gray-900   {color: #FFFFFF !important;}

@media (max-width: 768px) {
   .wiresort    {display: none !important;}
   .wiretags    {display: none !important;}
   .wireactive  {display: none !important;}
   .wirefilters {top: 160px !important;}
}

/* ==========================================================================
   tempsolution for sushi
   ========================================================================== */

.preloader-sushi {display: none !important;}

@media screen and (min-width: 1480px) {
    .listitemkind-classic   {width: 33.33% !important;}
    .listitemkind-halfwidth {width: 50% !important;}
    .fullcard-sushi {background:#000000 !important;}
    .productdescription-sushi {background:#000000 !important;}
}

/* ==========================================================================
   onderweg naar mollie
   ========================================================================== */

#waitscreen   {position: absolute; top:0px; width:100vw; height: calc(100vh - 65px); display: none;}
.MuiGrid-root {margin-top: 20px;}
.loader       {position: absolute; top: calc(34% - 32px); left: calc(50% - 32px); width: 100px; height: 100px;
               border-radius: 50%; perspective: 800px;}
.loadertext   {margin-top:400px;}
.inner        {position: absolute; box-sizing: border-box; width: 100%; height: 100%; border-radius: 50%;}
.inner.one    {left: 0%; top: 0%; animation: rotate-one 1s linear infinite; border-bottom: 3px solid #EFEFFA;}
.inner.two    {right: 0%; top: 0%; animation: rotate-two 1s linear infinite; border-right: 3px solid #EFEFFA;}
.inner.three  {right: 0%; bottom: 0%; animation: rotate-three 1s linear infinite; border-top: 3px solid #EFEFFA;}
@keyframes rotate-one   {0%   {transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);}
                         100% {transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);}}
@keyframes rotate-two   {0%   {transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);}
                         100% {transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);}}
@keyframes rotate-three {0%   {transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);}
                         100% {transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);}}

/* ==========================================================================
   salvatore grid
   ========================================================================== */

   .grid       {display: flex; flex-basis: 0; width: 100%; min-width: 100%; background-color: #090b14; z-index: 1;}
   .mediumgrid {display: flex; flex-basis: 0; width: 100%; min-width: 100%; background-color: #090b14;}
   .filtergrid {display: flex; flex-basis: 0; width: 100%; min-width: 100%; background-color: #090b14;}
   .smallgrid  {display: flex; flex-basis: 0; width: 100%; min-width: 100%; background-color: #090b14 !important;}
   .mobilegrid {display: flex; flex-basis: 0; width: 100%; min-width: 100%; background-color: #090b14; margin-left: auto; margin-right: auto;}
   
   .smallgrid[data-columns]::before  {content: '8 .column.size-1of8';}
   .mediumgrid[data-columns]::before {content: '6 .column.size-1of6';}
   .filtergrid[data-columns]::before {content: '3 .column.filter-1of3';}
   .grid[data-columns]::before       {content: '3 .column.size-1of3';}
   .mobilegrid[data-columns]::before {content: '4 .column.size-1of4';}
   
   [data-columns]::before {position: absolute; display: block; visibility: hidden; font-size: 1px;}
   
   @media screen and (max-width: 544px) {
     .grid[data-columns]::before        {content: '1 .column.size-1of1';}
     .mediumgrid[data-columns]::before  {content: '2 .column.size-1of2';}
     .filtergrid[data-columns]::before  {content: '3 .column.filter-1of3';}
     .smallgrid[data-columns]::before   {content: '3 .column.size-1of3';}
     .mobilegrid[data-columns]::before  {content: '2 .column.size-1of2';}
     .display-4 {font-size: 2rem;}
   }
   
   @media screen and (min-width: 544px) and (max-width: 768px) {
     .grid[data-columns]::before       {content: '2 .column.size-1of2';}
     .mediumgrid[data-columns]::before {content: '4 .column.size-1of4';}
     .display-4 {font-size: 2rem;}
   }
   
   @media screen and (min-width: 992px) and (max-width: 1400px) {
     .grid[data-columns]::before       {content: '3 .column.size-1of3';}
     .mediumgrid[data-columns]::before {content: '5 .column.size-1of5';}
   }
   
   @media screen and (min-width: 1400px) {
     .grid[data-columns]::before       {content: '4 .column.size-1of4';}
     .filtergrid                       {width: 590px; min-width: 590px;}
     .mediumgrid[data-columns]::before {content: '6 .column.size-1of6';}
   }
   
   .columnxxx {float: left;}
   
   .size-1of1 {width: 100%;    padding-right: 5px; padding-left: 5px;}
   .size-1of2 {width: 50%;     padding-right: 5px; padding-left: 5px;}
   .size-1of3 {width: 33.333%; padding-right: 5px; padding-left: 5px;}
   .size-1of4 {width: 25%;     padding-right: 4px; padding-left: 4px;}
   .size-1of5 {width: 20%;     padding-right: 5px; padding-left: 5px;}
   .size-1of6 {width: 16.666%; padding-right: 5px; padding-left: 5px;}
   .size-1of7 {width: 14.285%; padding-right: 5px; padding-left: 5px;}
   .size-1of8 {width: 12.5%;   padding-right: 5px; padding-left: 5px;}
   
   .filter-1of3 {padding-right: 5px; padding-left: 5px;}

   .groupsbody .row {margin-left: -3px !important; margin-right: -5px !important;}

@media screen and (max-width: 768px) {
    .size-1of2  {width: 50%; padding-right: 0px; padding-left: 0px;}
    .mobilegrid {min-width: 98% !important; width: 98% !important; margin-top: 6px; margin-left: auto; margin-right: auto;}
}

/* ==========================================================================================
   SPLITSCREEN -> ONDER DE 1020PX IS ALLES 1 BREED
   ========================================================================================== */

@media screen and (max-width: 1025px) {
  .splitleft  {position: fixed; width: 100vw !important; left:0px; top: 69px; height: calc(100vh - 69px); width: 100%;}
  .splitright {display: none;}
  .threequart {width: 100%;}
}

@media screen and (min-width: 1024px) and (max-width: 1200px) {
  .splitleft           {width: 60% !important;}
  .splitright          {width: 40% !important;}
  .sidebarbackground   {width: 40% !important;}
}

@media screen and (min-width: 1200px) {
    .splitleft  {position:absolute; left:0px; top:69px; height: calc(100vh - 69px); width: 77%;}
    .splitright {position: fixed; top: 69px; right: 0px; width: 23%; min-width: 300px; height: 100vh; clear: none; overflow-y: scroll; -webkit-overflow-scrolling: touch; 
                letter-spacing: 0; margin-left: 0; padding-left: 10px; padding-right: 10px; user-select: none; z-index: 998; padding-bottom: 100px;
                background-image: url('../../img/backgrounds/blacksidebar.jpg'); background-size: 100% auto;}
    .threequart {width: 77% !important;}
}

@media screen and (min-width: 1090px) and (max-width: 1480px) {
  .splitleft                   {width: 70%      !important;}
  .splitright                  {width: 30%      !important;}
  .sidebarbackground           {width: 30%      !important;}
  .maincontainer-portguide     {top: 40px       !important;}
  .maincontent-portguide       {width: 76%      !important; flex: 0 0 76% !important; max-width: 76% !important;}
  .sidebar-portguide           {width: 24%      !important;}
  .sidebarlogo-veilig-op-slot  {margin-top: 0px !important;}
  .listitemkind-noimage        {width: 50%      !important;}
  .listitemkind-minimal        {width: 50%      !important;}
  .listitemkind-threeinarow    {width: 50%      !important;}
  .listitemkind-classic        {width: 50%      !important;}
  .listitemkind-square         {width: 50%      !important;}
  .listitemkind-portrait       {width: 50%      !important;}
  .listitemkind-menu           {width: 50%      !important;}  
  .listitemkind-pakket         {width: 50%      !important;}
  .listitemkind-halfwidth      {width: 50%      !important;}
  .listitemkind-fullwidth      {width: 100%     !important;}
}
  
@media screen and (min-width: 1480px) {
  .splitleft                   {width: 77%      !important;}
  .splitright                  {width: 23%      !important;}
  .sidebarbackground           {width: 23%      !important;}
  .maincontainer-portguide     {top: 40px       !important;}
  .maincontent-portguide       {width: 76%      !important; flex: 0 0 76% !important; max-width: 76% !important;}
  .sidebar-portguide           {width: 24%      !important;}
  .sidebarlogo-veilig-op-slot  {margin-top: 0px !important;}
  .listitemkind-noimage        {width: 25%      !important;}
  .listitemkind-minimal        {width: 33.33%   !important;}
  .listitemkind-threeinarow    {width: 33.33%   !important;}
  .listitemkind-classic        {width: 33.33%   !important;}
  .listitemkind-square         {width: 33.33%   !important;}
  .listitemkind-portrait       {width: 33.33%   !important;}
  .listitemkind-menu           {width: 33.33%   !important;} 
  .listitemkind-pakket         {width: 33.33%   !important;}
  .listitemkind-halfwidth      {width: 50%      !important;}
  .listitemkind-fullwidth      {width: 100%     !important;}
}


/* ==========================================================================
   cols and rows
   ========================================================================== */

.col-md-12 {position:relative; width:100%; padding-right:15px; padding-left:15px;}
.col-md-12 {flex:0 0 100%; max-width:100%;}

.row {display:flex; flex-wrap:wrap; margin-right:-15px; margin-left:-15px;}

/* ==========================================================================
   sidebar
   ========================================================================== */

#logoright           {height: 400px; width: auto; margin-top: -50px; margin-bottom: -110px; margin-left: auto; margin-right: auto;
                      background-size: contain; background-repeat: no-repeat; background-position: center;}
.sidebarheadertext   {display: inline-block; margin-top: -10px; padding-left: 10px; font-family: "Roboto Regular"; font-size: 20px; font-weight: 400; line-height: 1.1; color: #FFFFFF; -webkit-font-smoothing: antialiased;}
.sidebaritem         {margin-left: 10px; color: #FFFFFF; width: 220px; -webkit-font-smoothing: antialiased;}
.w3-card-2           {padding-left: 10px; padding-right: 10px;}
.w3-ul a             {color: #FFFFFF !important; text-decoration: none;}
.w3-ul li            {font-family: "Roboto Light"; min-height: 60px; padding: 8px 16px; -webkit-font-smoothing: antialiased; cursor: pointer;}
.w3-left             {float: left !important;}
.w3-large            {font-size: 18px !important;margin-top: 0px;}
.w3-small            {display: block; font-size: 14px !important; margin-top: -1px; line-height: 1.2;}
.w3-margin-right     {margin-right: 16px !important;}
.w3-hoverable li img {height: 45px; width: auto; max-width: 66px; border-radius: 8px;}

.taglist {min-height: 46px !important; text-align: center; margin-bottom: 10px; border-radius: 8px; background-color: #222222; cursor: pointer;}
.taglist-luxury {background-color: #061921; border: 1px solid #112430; border-radius: 8px; margin-bottom: 10px;}
.splitright .favorieten img {object-fit: cover;}
.morespacebeneith {margin-top: 16px;}
.body-slagerij-verstappen .sidebarheadertext {color: #ffbb54;}
.td-luxury li {border-bottom: 1px solid #13181e !important;}

.sidebar-warung-iengie {
    background-image: repeating-linear-gradient(45deg, rgba(226, 226, 226, 0.06) 0px, rgba(226, 226, 226, 0.06) 2px,
                      transparent 2px, transparent 4px), linear-gradient(90deg, rgb(33, 33, 33), rgb(33, 33, 33)) !important;}

.sidebarlogo-sushisensei {margin-top: -120px !important;}

.info {padding-left:10px;}

@media (min-width: 800px) {
  .divider1 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider2 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider3 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider4 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider5 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider6 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider7 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider8 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider9 img    {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider10 img   {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider11 img   {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider12 img   {width: 100% !important; max-width: 110% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
}

@media (max-width: 800px) {
  .divider1 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider2 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider3 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider4 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider5 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider6 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider7 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider8 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider9 img    {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider10 img   {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider11 img   {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
  .divider12 img   {width: 90% !important; max-width: 100% !important; margin-left: -5% !important; object-fit: cover; border-radius: 4px !important;}
}

@media screen and (min-width: 768px) {
   .sidebarlogo-slagerij-verstappen {background-image: url(../../img/sidebarlogos/slagerij-verstappen-sidebarlogo.png); margin-top: -115px !important;}
    .l           {margin-left: 10px; color: #FFFFFF; width: 220px; -webkit-font-smoothing: antialiased; opacity: 0.7;}
    .l .dagen    {color: #FFFFFF; width: 100px; float: left;}
    .l .tijden   {color: #FFFFFF;}
    .b           {margin-left: 10px; color: #FFFFFF; width: 100%; -webkit-font-smoothing: antialiased; opacity: 0.7;}
    .b .postcode {color: #FFFFFF; width: 15%; float: left;}
    .b .area     {color: #FFFFFF; width: 100%; padding-right: 5px;}
}

.td-luxury .active {
    background: linear-gradient(253deg, rgb(20 77 104) 0%, rgb(2 24 34) 50%, rgb(37 55 61) 100%) !important;
    box-shadow: inset 0px 0px 0px 1px #405a61;
}

.td-luxury li:hover {
    background: linear-gradient(15deg, rgb(32 67 84) 0%, rgb(12 31 40) 50%, rgb(0 0 0) 100%) !important;
    box-shadow: inset 0px 0px 0px 1px #ffa806;
}

/* ==========================================================================
   cards
   ========================================================================== */

.card {position: relative; display: flex; flex-direction: column; width: calc(100% - 2px); min-width: 0;
       word-wrap: break-word; background-clip: border-box; border-radius: .25rem; border: 0px; border-bottom: 40px solid transparent;
       margin-bottom: 10px; color: #FFFFFF; user-select: none;}

.fullcard                 {min-height: 100px; margin-top: 6px; border-radius:9px;}
.webshop .fullcard        {transition-property: none !important; transform: none !important; animation: none !important;}
.weightshop .fullcard     {transition-property: none !important; transform: none !important; animation: none !important;}
.card-img-overlay         {position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 1.25rem;}
.bg-over                  {background: rgba(0, 0, 0, 0.1); width: 100%;}
.link-over                {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; cursor: pointer;}
.assgroepcard-title       {position: absolute; bottom: -50px; color: #ffffff; font-size: 17px; font-weight: 500; line-height: 1; margin-bottom: .5rem;}
.assgroepcard-description {position: absolute; bottom: -71px; margin-left: -10px; color: #ffffff; font-size: 12px; font-weight: 300;}
.assgroepcard-img         {border-radius: 9px 9px 0px 0px; object-fit: cover;}

.assgroepcard-luxury      {background-color: rgb(4 22 30); border-bottom: 80px solid #0c121a !important;}
.assgroepcard-sushi       {border-bottom: 80px solid #000000;}
.assgroepcard-title-sushi {position: absolute; margin-left: 14px; font-size: 32px; bottom: -46px !important;}
.assgroepcard-title-slagerij-verstappen {color: #f1b96a; background-color: #f0c970; background-image: linear-gradient(45deg, #fbc154, #ffa700);
    background-size: 100%; background-repeat: repeat; -webkit-text-fill-color: transparent; font-size: 24px !important; text-shadow: none !important;}

.groupsbody-slagerij-verstappen .assgroepcard {border-bottom: 50px solid #03141e !important;}

@media (min-width: 768px) {
   .assgroepcard {margin-top: 10px !important;}
   .assgroepcard-title-slagerij-verstappen {margin-left: 0 !important;}
   .assgroepcard-description-slagerij-verstappen {bottom: -67px !important; font-size: 17px !important;}
   .body-slagerij-verstappen .assgroepcard-description {margin-left: 0 !important;}
   .card {transition:transform .5s; border-radius:6px;}
   .card:hover {transform:scale(1.01); filter:brightness(1.1);}
}

@media (max-width: 768px) {
    .assgroepcard-plaza-exotica {border-bottom: 22px solid #0c121a !important;}
    .groupsbody-slagerij-verstappen .assgroepcard {border-bottom: 50px solid #08191f;}
    .groupsbody-slagerij-verstappen .assgroepcard-title {bottom: -36px; margin-left: -11px; font-size: 17px !important;}
    .groupsbody-slagerij-verstappen .assgroepcard-description {bottom: -42px; margin-left: -11px; font-size: 9px !important;}
    .groupsbody-slagerij-verstappen .assgroepcard-img   {height: 120px !important;}
    .assgroepcard-title-plaza-exotica {bottom: -24px !important; margin-left: -10px !important;}
    .assgroepcard-title-luxury {background-color: #f0c970; color: #f1b96a; background-image: linear-gradient(45deg, #fbc154, #ffa700); margin-bottom: .5rem; font-weight: 500;
                                background-size: 100%; background-repeat: repeat; -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent;}
    .assgroepcard-description-plaza-exotica {bottom: -34px !important; margin-left: -10px !important; letter-spacing: -0.5px;}
}

.card a,.card a:focus,.card a:hover {text-decoration:none; outline:none;}
.card-img         {flex-shrink:0; width:100%; object-fit: cover;}
.card-img         {border-top-left-radius:calc(.25rem - 1px); border-top-right-radius:calc(.25rem - 1px);}
.card-img         {border-bottom-right-radius:calc(.25rem - 1px); border-bottom-left-radius:calc(.25rem - 1px);}

.webshop    .productsbodyitems .card {border-bottom: 0px solid transparent !important;}
.weightshop .productsbodyitems .card {border-bottom: 0px solid transparent !important;}

/* ==========================================================================
   base card overlays
   ========================================================================== */

.card-producttitle     {position: relative; width: 100%; text-transform: uppercase; font-family: "Roboto Medium"; font-size: 18px; line-height: 20px; text-align: left; padding: 8px; 
                        padding-left: 14px; padding-right: 10px; z-index: 100; min-height: 35px; border-top-left-radius: 8px; border-top-right-radius: 8px; -webkit-font-smoothing: antialiased;}
.bigproducttext        {position: absolute; width: 100%; height: 100%; font-size: 23px; line-height: 28px; text-align: left; padding: 0px 40px 0px 20px;}
.smalproducttext       {margin-left: 20px; font-size: 13px; text-transform: uppercase; margin-top: 3px; opacity: 0.5; z-index: 9;}
.productdescription    {width: 100%; background: transparent; color: #FFFFFF; bottom: 0; padding-left: 26px; padding-right: 26px; -webkit-font-smoothing: antialiased; text-shadow: 0px 0px 20px #350006;}
.productfooter         {position: absolute; left: 0px; bottom: 0px; height: 40px; width: 100%; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;}
.prijs                 {position: absolute; right: 80px; font-family: "Roboto Light"; font-size: 26px; bottom: -40px; color: #FFFFFF;}
.thatsright            {right: 80px !important;}
.inhoud                {position: absolute; display: inline-block; color: inherit; left: 50px; bottom: 9px !important; z-index: 3; font-size: 14px; text-transform: uppercase; color: #FFFFFF; opacity: 0.9;}
.xaantal               {position: absolute !important; right: 12px; width: 50px; height: 50px; line-height: 50px; border-radius: 50%; z-index: 199; cursor: pointer; pointer-events: none;
                        text-align: center; overflow: visible; letter-spacing: -2px; display: none;}                  
.xinput                {position: absolute; bottom: -3px; left: -7px; width: 54px; font-size: 26px !important; text-align: center; overflow: visible !important;
                        z-index: 199; letter-spacing: -2px; background-color: transparent !important; ;}
.addtobasket           {position: absolute; bottom: 10px !important; right: 12px; width: 50px; height: 50px; background-color: #000000;
                        background: url('../../img/interface/addicon-red3.png'); background-size: cover; border-radius: 50%; z-index: 196; cursor: pointer;}
.addtenhandle          {position: absolute; bottom: 10px; right: 67px; width: 50px; height: 50px; z-index: 199; cursor: pointer; overflow: visible;
                        background-image: url('../../img/interface/addtenbutton.png'); background-size: 50px 50px;}
.substracthandle       {position: absolute; display: none; bottom: 46px; right: 56px; width: 44px; height: 44px; z-index: 195;
                        background-image: url('../../img/interface/minusicon-red2.png'); background-size: 44px 44px; cursor: pointer; overflow: visible;}               
.favomschrijving       {position: absolute !important; top: 70px; font-size: 30px; line-height: 40px; text-align: center;}
.favfooter             {bottom: -30px !important; font-size: 14px !important;}
.origineleprijs        {position: absolute; left: 240px; font-size: 20px; margin-top: 4px; color: #ff2a04;}

/* WEIGHTSHOP OVERRULERS */
.weightshop .substracthandle  {right: 120px; background-image: url('../../img/interface/substractbutton.png') !important;}
.weightshop .xaantal          {right: 11px; width: 100px; height: 32px; line-height: 50px; border-radius: 6px;}
.weightshop .xinput           {color: transparent !important;}
.weightshop .xviewinput       {position: absolute; background-color: transparent; bottom: 3px; left: -10px; width: 95px; font-size: 20px; color: #FFFFFF;
                               text-align: right; overflow: visible; z-index: 184; letter-spacing: -1px; user-select: none;}
.weightshop .infopopup        {position: absolute; display: inline; width: 26px; height: 26px; left: 13px; bottom: 6px; cursor: pointer; opacity: 0.5;
                               z-index: 3; background: url('../../img/interface/infopopup.png') no-repeat; background-size: cover;}
.weightshop .addkghandle      {position: absolute; bottom: 10px; right: 67px; width: 50px; height: 50px; z-index: 199; cursor: pointer; overflow: visible;
                               background-image: url('../../img/interface/kilobutton.png'); background-size: 50px 50px;}
.weightshop .prijs            {position: absolute; bottom: 0px; right: 130px; font-family: "Roboto Light"; font-size: 22px; margin-bottom: 4px; color: #FFFFFF;}
.weightshop .onzichtbaar      {color: transparent !important;}

/* WEBSHOP OVERRULERS */
.webshop .substracthandle {bottom: 40px !important;}
.webshop .xaantal         {bottom: 9px; line-height: 50px; border-radius: 50%; pointer-events: none; text-align: center; overflow: visible; 
                           z-index: 200; letter-spacing: -2px; cursor: pointer;}
.webshop .xinput          {color: #000000 !important;}
.webshop .prijs           {bottom: 0px  !important;}
.webshop .stickeroverlay  {bottom: 56px !important;}
.webshop .stickerprice    {bottom: 62px !important;}
.webshop .listitemkind-classic .smalproducttext {bottom: 62px !important;}

@media (min-width: 768px) {.webshop .xinput {bottom: -2px !important; left: 3px !important;}}

/* CLASSIC BUTTON */
.listitemkind-classic .xaantal {position: absolute; right: 12px; width: 50px !important; height: 50px; bottom: 11px !important; line-height: 50px; border-radius: 50%;
                                z-index: 200; pointer-events: none; text-align: center; overflow: visible; border: 4px solid #FF0000 !important; background-color: #FFDC03 !important;
                                letter-spacing: -2px; cursor: pointer; display: none;}
.listitemkind-classic .substracthandle {right: 60px;}
.listitemkind-classic .prijs           {right: 80px !important;}

.listitemkind-portrait .xaantal {position: absolute; right: 12px; width: 50px !important; height: 50px; bottom: 10px !important; line-height: 50px;
                                 border-radius: 50%; z-index: 200; pointer-events: none; text-align: center; overflow: visible; border: 4px solid #FF0000 !important;
                                 background-color: #FFDC03 !important; letter-spacing: -2px; cursor: pointer; display: none;}
.listitemkind-portrait .xviewinput {font-size: 24px; bottom: 6px; left: -5px; width: 50px; text-align: center;color: #000000;}

.fullcard-aatventure                {background-image:none;}
.fullcard-aatventure .addtenhandle  {bottom: 10px; right: 67px;}

/* DONT SHOW ADD TEN AT PLAZA EXOTICA/WARUNG/TORRE */
.productsbodybg-plaza-exotica .addtenhandle {display: none !important;}
.productsbodybg-warung-iengie .addtenhandle {display: none !important;}
.productsbodybg-la-torre .addtenhandle      {display: none !important;}

.floatingbutton {position: fixed; width: 60px; height: 60px; bottom: 40px; left: 20px; color: #FFFFFF; border-radius: 50px; text-align: center; cursor: pointer; z-index: 998;opacity: 0.9;}
.shoppingbasket {display: block; width: 45px; height: 45px; background-image: url('../../img/interface/shoppingbasket.png'); background-repeat: no-repeat;
                 background-size: contain; margin-left: 6px; margin-top: 6px; z-index: 9999;}

.body-slagerij-verstappen .floatingbutton {background-color: #021822 !important; border: 1px solid #263740 !important; box-shadow: 2px 2px 3px #022d30 !important;}

@media (max-width: 768px) {
  .bigproducttext {font-size: 23px; line-height: 30px; padding-right: 30px;}
}

.body-slagerij-verstappen .infopopup {filter: saturate(0%) !important;}
.footerbg-luxury {background-color: rgb(4 22 30);}

.stickeroverlay {position: absolute; display: none; left: 10px; width: 100px; height: 50px; z-index: 195; transform: rotate(-4deg);
                 background-image: url(../../img/interface/stickeroverlay.png); background-repeat: no-repeat; background-size: contain; cursor: pointer; overflow: visible;}
.stickerprice {position: absolute; display: none; left: 9px; bottom: 46px; width: 100px; height: 43px; z-index: 196; transform: rotate(-4deg); font-family: "Jellee";
               font-size: 21px; padding-top: 10px; text-align: center; color: #FFFFFF; padding-right: 13px; cursor: pointer; overflow: visible;}

.productsbodybg-plaza-exotica .listitemkind-threeinarow .stickeroverlay {bottom: 160px !important;}
.productsbodybg-plaza-exotica .listitemkind-threeinarow .stickerprice   {bottom: 166px !important; left: 10px !important;}

/* ==========================================================================
   assortimentsgroepheader
   ========================================================================== */

#assgrpwrapper {position: relative; width: 100%; text-align: center; height: 56px; width: 100%; line-height: 40px; z-index: 999;}

.body-slagerij-verstappen #assgrpwrapper {
   background: radial-gradient(ellipse farthest-corner at right bottom, #ff7e04 0%, #ffce6b 8%, #ffa001 30%, #f7a213 40%, transparent 80%), 
               radial-gradient(ellipse farthest-corner at left top, #090a10 0%, #d9aa0e 8%, #ffa500 25%, #d8400a 62.5%, #ff0000 100%);
   filter: hue-rotate(0.98turn);
   box-shadow: inset 2px 2px 1px 0 rgb(0 0 0);
}

@media screen and (max-width: 768px) {
   #assgrpwrapper {position: relative; margin-top: 0px; height: 60px;}
}

.assgroepbg-plaza-exotica {background-color: #ef8b34; background-image: url(../../img/backgrounds/warung-iengie-assgroupheader.webp) !important;
                           background-repeat: no-repeat; background-position: 0px 0px; background-size: cover !important;}
.assgroepbg-sushi {background-image: url(../../img/backgrounds/sushisenseibanner2.png); background-color: transparent; color: #FFFFFF;}

.groupsbody-slagerij-verstappen #assgrpwrapper {
   background: radial-gradient(ellipse farthest-corner at right bottom, #000000 0%, #f9ab47 8%, #fbac47 30%, #ec9200 40%, transparent 80%), 
               radial-gradient(ellipse farthest-corner at left top, #000000 0%, #faab47 8%, #cf760e 25%, #ff7f10 62.5%, #000000 100%);
   filter: hue-rotate(0.98turn); box-shadow: inset 2px 2px 1px 0 rgb(0 0 0);}

.assortimentsgroepheader {position: relative; padding: 0; margin: 0; width: 100%; height: 60px; text-align: center; z-index: 200; overflow: visible; 
                          font-family: "Myriad Regular"; font-size: 28px; font-weight: 700; text-transform: uppercase; line-height: 1; padding-top: 16px;}

.modassgroupheader {height: 60px !important; padding-top: 20px !important;}

.groupsbody-slagerij-verstappen .assortimentsgroepheader {text-shadow: 2px 6px 4px #c17b0e;}

@media (min-width: 768px) {.groupsbody-slagerij-verstappen .assgroepcard-img {height: 120px !important; border: 1px solid #010101;}}

@media screen and (max-width: 768px) {
   .groupsbody #assgrpwrapper {position: relative; margin-top: 0px; height: 60px;}
   .assgroepbg-sushi {background-size: 190% 110% !important;}
   .assortimentsgroepheader {font-size: 28px !important;}
}

.backarrow {position: absolute; width: 50px; height: 50px; cursor: pointer; opacity: 0.5; -webkit-font-smoothing: antialiased; z-index: 998 !important;}

.minimalswitch {position: absolute; top: 12px; right: 20px; background-image: url(../../img/interface/minimal.png); z-index: 99999;
                background-repeat: no-repeat; background-size: cover; width: 32px; height: 32px; cursor: pointer; opacity: 0.5;}

/* ==========================================================================
   listitems = productgrid
   ========================================================================== */

@media (min-width: 768px) {
   .productsbody #maincontainer {padding-left: 10px; padding-right: 15px;}
   .productsbodyitems           {padding-left: 5px;  padding-right: 5px;}
}

.list-item                   {display:block; position:relative;}
.aatsflexrow .list           {display: flex; flex-wrap: wrap; margin-left: auto; margin-right: auto; width: 100%;}
.aatsflexrow .list-content   {display:flex; flex-direction:column; width:100%; background:transparent;}
.aatsflexrow .list-item      {display:flex; width:100%; padding:4px; padding-left:6px; padding-right:6px;}
.aatsflexrow .list-content p {flex: 1 0 auto;}

@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) {
   .aatsflexrow .list-item {width:50%!important;}
}

@media screen and (min-width: 768px) {
    .list-item {padding-top: 8px !important; padding-left: 4px !important; padding-right: 4px !important;}
}

/* ==========================================================================
   icons
   ========================================================================== */

.fas                         {font-style: normal !important;}
.fa-angle-double-left        {padding-left: 17px;}
.fa-angle-double-left:before {font-family: FontAwesomeSolid !important; content: "\f100" !important; line-height: 56px; font-size: 24px;}

.shareicon            {background-color:#1e232b;border:1px solid #212327;border-radius:50%!important;min-width:65px;min-height:65px;margin-top:6px;vertical-align:middle;}
.facebookcolor        {background-image:url("https://aatventure.news/img/interface/facebook.png");background-size:cover!important;}
.twittercolor         {background-image:url("https://aatventure.news/img/interface/twitter.png");background-size:cover!important;}
.whatsappcolor        {background-image:url("https://aatventure.news/img/interface/whatsapp2.png");background-size:cover!important;}
.facebookcolor:active {background-image:url("https://aatventure.news/img/interface/facebook.png");}
.twittercolor:active  {background-image:url("https://aatventure.news/img/interface/twitter.png");}
.whatsappcolor:active {background-image:url("https://aatventure.news/img/interface/whatsapp2.png");}

.glyphicon               {position:relative; top:0px; display:inline-block; font-family:'Glyphicons Halflings' !important; vertical-align:middle;
                          font-style:normal; font-weight:400; line-height:1; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
.glyphicon-remove        {float:right; top:-3px; font-size:26px; cursor:pointer; color:#FFFFFF;}
.glyphicon-remove:before {content:"\e014";}
.fa-pen-to-square:before {font-family:FontAwesomeSolid!important; content:"\f044"!important;}
.fa-pen-to-square:before {font-style:normal!important; float:right; margin-right:20px; margin-top:-20px; cursor:pointer;}

/* ==========================================================================
   backdrop
   ========================================================================== */

.backdropmenu li {display: block; color: #FFFFFF; font-family: "Roboto Light"; font-size: 15px; font-weight: 400; text-transform: uppercase;
                  text-align: right; background-color: rgba(0, 0, 0, 0.7); border: 1px solid rgba(200, 200, 200, 0.3); border-radius: 6px 0px 0px 6px;
                  padding: 7px 20px 7px 6px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4); margin-top: 8px; margin-right: -2px; cursor: pointer; -webkit-font-smoothing: antialiased;}

.overlaymenu        {display: none;}
.innertext          {display: block; width:100%; text-align:center; padding-bottom:12px; font-size: 17px;}
.overlayinfo        {display: none;  background-color:rgba(0,0,0,0.8);height:100%;position:absolute;z-index:99;top:36px;height:calc(100% - 36px);width:100%;}
.productinfo        {display: none;  position:absolute; top:0px;height:100%;width:100%;padding:15px;overflow-y:auto;}
.allergieinfo       {display: none;  position:absolute; top:0px;height:100%;width:100%;padding:15px;overflow-y:auto;}
.voedingswaardenx   {display: none;  padding: 20px; font-size: 16px; overflow: auto; height: 250px;}
.hoogaantal         {display: none;  position:absolute; top:0px;height:100%;width:100%;padding:15px;overflow-y:auto;}
.remarksinfo        {display: none;  position:absolute; top:0px;height:100%;width:100%;padding:15px;overflow-y:auto;}
.shareinfo          {display: none;  position:absolute; top:0px;height:100%;width:100%;padding:15px;overflow-y:auto;}
.shareicons         {margin-top:-10px;}
.allergenen         {display:flex; flex-wrap:wrap; align-items:flex-start; flex-direction:row; max-height:100vh;}
.allergenen img     {max-width:92px;}
.shareicon          {display:inline-block; background-color:#1e232b; border-radius:50%!important; min-width:65px; min-height:65px;
                     border:1px solid #212327; margin-left:10px; margin-top:6px; vertical-align:middle;}
.sharetxt           {padding-left:20px;}
.sharelink          {float: right; padding-right: 6px; color:rgba(255,255,255,0.7); cursor:pointer;}
.sharelink i        {display:block; font-size:20px;}


/* ==========================================================================
   modal
   ========================================================================== */

.modal        {display:none; overflow:hidden; position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; z-index:99999!important; -webkit-overflow-scrolling:touch; outline:0; color:#51586A; padding:0px;}
.modal-dialog {max-width: 584px !important; margin-left:auto; margin-right:auto;}
.modal-header {display:flex; height:50px; padding:22px; background-color:#5B6E7E; border-bottom:1px solid #000000; box-shadow:0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);}
.modal-body   {position:relative;flex:1 1 auto;padding:15px;color:#FFFFFF!important;}
.modal-content{position:relative; display:flex; flex-direction:column; width:100%; min-height:90vh; font-family:"Roboto Light"; outline:0; overflow-x:hidden; overflow-y:auto!important;
               box-shadow:0 3px 9px rgba(0, 0, 0, 0.5); border:0; -webkit-font-smoothing:antialiased; -webkit-overflow-scrolling:touch; border-radius:8px;}
.modal-title  {width:100%; color:#FFFFFF; font-size:18px; line-height:1.42857143; margin:0; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical;
               -webkit-line-clamp:1; text-align:left; padding-left:10px; width:100%; margin-top:-12px; font-family:"Myriad Regular"; font-size:26px; font-weight:700; text-transform:uppercase;}
.modal-footer {padding: 15px; text-align: right; padding-left: 8px; padding-right: 8px; border-top: 0;}

.modal-open .modal {background: rgba(0, 0, 0, 0.6); overflow-x:hidden; overflow-y:auto;}

.modal-ingredienten {clear:both;}
.pmodheader         {font-size:16px;font-weight:700;}
.pmodheaderal       {width:100%;font-size:16px;font-weight:700;text-align:center;margin-bottom:10px;}
.modalsmalltext     {display:inline-block;font-size:15px;line-height:20px;}
.modal .glyphicon   {position:absolute; font-size:25px ;top:0px; right:18px; color:#FFFFFF; -webkit-appearance:none;}
.shareicon          {display:inline-block;background-color:#1e232b;border-radius:50%!important;min-width:65px;min-height:65px;border:1px solid #212327;margin-left:10px;margin-top:6px;vertical-align:middle;}
.closebutton        {padding-top:15px;}
.infox               {margin:0!important;font-size:22px;line-height:1.9;}

.modal-productinfo{color:#FFFFFF;font-size:18px;line-height:1;margin:0;display:-webkit-box;-webkit-box-orient:vertical;line-clamp:1;
                   text-align:left;padding-left:10px;width:100%;margin-top:-9px;font-family:"Myriad Regular";font-size:26px;font-weight:700;text-transform:uppercase;}
.modwisbestelling     {margin-top: 110px !important; max-width: 400px !important; height: 136px; overflow-y: hidden;}
.modalbody-luxury    {background-color:#030f16 !important; overflow:hidden;}
.modalheader-luxury  {border:0px solid #fd992c !important; color:#FFFFFF!important;}
.modalcontent-luxury {background-color:#161F28; margin-bottom: 100px;}
.modaltitle-luxury   {color:#FFFFFF!important;}
.modalheader-luxury  {background-color:#ef8b34; background-image:url('https://aatventure.news/img/backgrounds/warung-iengie-assgroupheader.webp')!important;
                      background-repeat:no-repeat ;background-position:0px 0px;background-size:cover!important;}

@media (min-width: 768px){
   .modal-dialog  {max-width: 584px; margin-top: 10px;}
   .modal-content {max-width:100%!important; box-shadow:0 5px 15px rgba(0,0,0,0.5);}
   .modalbigwidth {width: 800px !important; max-width: 800px !important;}
}

@media (max-width: 768px)  {
   .modal             {top:0px; height:100vh;}
   .modal-dialog      {margin:0px !important;}
   .modal-content     {border-radius:0!important;}
   .modal-open .modal {margin-top:68px; height:calc(100vh - 68px)!important; overflow:auto; overflow-x:hidden;}
   .modal-header      {border-radius:0px!important;}
}

@media (min-width: 1024px) {.modal-dialog {max-width: 800px;}}

@media screen and (max-width: 700px){
   .modal-title {margin-top:-6px !important; line-height:1 !important; font-size:27px !important;}
}

/* ==========================================================================
   buttons
   ========================================================================== */

[type=button]                {-webkit-appearance:button;}
[type=button]:not(:disabled) {cursor:pointer;}

.btn-bigbuts   {height: 40px !important; font-size: 18px !important; border-radius: 6px !important;}
.btn-clear     {background-image: -webkit-linear-gradient(top, #de2311, #de2311); border: 1px solid #FF0000; color: #FFFFFF;}
.btn-annuleren {background-image: -webkit-linear-gradient(top, #3ede11, #2bde11); border: 1px solid #3dff00; color: #FFFFFF; margin-top: 20px;}

/* ==========================================================================
  timepicker
  ========================================================================== */

.timepickerheight #timepicker {margin-top:10px}

.ui-timepicker-wrapper {
    max-height: 60vh;
    overflow-x: hidden;
    overflow-y: auto;
    background: #16171d !important;
    color: #FFFFFF !important;
    border: 1px solid #000000 !important;
    box-shadow: 0 5px 10px rgba(0,0,0,0.2);
    outline: none;
    z-index: 9999999999 !important;
    margin: 0;
    text-align: center;
}

.ui-timepicker-list li {
    padding: 3px 0 3px 5px;
    cursor: pointer;
    white-space: nowrap;
    color: #FFFFFF !important;
    list-style: none;
    margin: 0;
    font-size: 22px;
    line-height: 26px;
    background-color: #17161D;
    border-bottom: 1px solid #282a33;
}

.ui-timepicker-list:hover .ui-timepicker-selected {background: transparent;}
.ui-timepicker-wrapper {max-height: 300px !important;}
@media (min-width: 768px) {.ui-timepicker-wrapper {width: 568px !important; margin-left:0px !important}}

/* ipad */
@media screen and (max-width: 1025px) {.ui-timepicker-wrapper {width: 466px !important}}
/* phones under 444 px width */
@media screen and (max-width: 767px) {.ui-timepicker-wrapper {width: calc(100vw - 34px) !important}}
/* ipad portrait */
@media screen and (width: 768px) and (orientation : portrait) {
  .modal-dialog {margin-top: 100px !important;}
}

/* ==========================================================================
   listitemkinds
   ========================================================================== */

.listitemkind-portrait .card-producttitle  {display: none !important;}
.listitemkind-portrait .card-img           {border-bottom: 40px solid transparent;} /* MISSCHIEN OOK BIJ SQUARE? */
.listitemkind-portrait .substracthandle    {right: 60px !important;}
.listitemkind-portrait .inhoud             {opacity: 0;}
.listitemkind-portrait .prijs              {right: 80px !important;}
.listitemkind-portrait .infopopup          {filter: grayscale(1) brightness(0);}

.listitemkind-threeinarow .bigproducttext:after {position: absolute; left: 20px; content: ''; border-width: 0 0 1px; border-style: solid; bottom: 258px !important; width: 70%;}

.listitemkind-halfwidth .xaantal           {bottom: 70px !important;}
.listitemkind-halfwidth .card-producttitle {display: none;}

/* ==========================================================================
   verstappen modal
   ========================================================================== */

/*! CSS Used from: https://slagerijverstappen.online/css/aatventure-base-2023.css */
nav{display:block;}
input,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit;}
input{overflow:visible;}
label{display:inline-block;margin-bottom:4px;}

.clearfloat{clear:both!important;}
input::placeholder{color:#999999!important;opacity:0.5!important;}
textarea,input{outline:none!important;}
input{box-sizing:border-box;}

@media (min-width: 768px) {textarea {min-height:160px;}}
@media (max-width: 768px) {textarea {min-height:200px;}}

.form-control{display:block;width:100%;height:35px;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#FFFFFF;border-radius:4px;border:1px solid #132030;background-color:#17202f;}
.form-control:focus{box-shadow:0 0 0 0.2rem rgba(0,0,0,0);outline:0;border-radius:0;}
.modal .form-control{background-color:#292D3A;color:#FFFFFF!important;border:0px!important;}
@media (min-device-width: 800px){
.form-group{text-align:right;}
}
.modal-body{position:relative;flex:1 1 auto;padding:15px;color:#FFFFFF!important;}
.modal-remark{background-color:#ff2a05;padding:15px;text-align:center;color:#FFFFFF;margin-bottom:16px;font-weight:700;}
label.css-label{background-image:url('https://slagerijverstappen.online/img/interface/csscheckbox.png');-webkit-touch-callout:none;user-select:none;}
input[type=checkbox].css-checkbox + label.css-label{padding-left:60px;height:50px;display:inline-block;ç:50px;line-height background-repeat:no-repeat;background-position:0 0;font-size:15px;vertical-align:middle;cursor:pointer;}
input[type=checkbox].css-checkbox:checked + label.css-label{background-position:0 -50px;}
.modal .form-group{text-align:left;}
.form-group{margin-bottom:10px;}
.timepickerheight #timepicker{margin-top:10px;}
.formcontrol-aatventure{background-color:#292D3A;border:1px solid #292D3A;color:#FFFFFF!important;}

/*! CSS Used from: https://slagerijverstappen.online/css/aatventure-shop-2025.css */

.modalbody-aatventure{overflow-x:hidden!important;overflow-y:visible!important;}
.modalbody-aatventure .form-control{background-color:#292D3A;color:#FFFFFF!important;}
.modalbody-aatventure::-webkit-scrollbar{width:0px!important;}
@media screen and (min-width: 700px){
.modalbody-aatventure{margin-top:40px;padding-left:0px;padding-right:0px;padding-top:7px;}
.weightshop .modalbody-aatventure{margin-top:0px!important;padding-left:15px!important;padding-right:15px!important;padding-top:0px!important;}
}
.formcontrol-aatventure {display:block; width:100%; height:35px;}
@media (min-width: 767px){
 .bestelmodelmargin{margin-top:15px;}
}
.modal-remark{padding:15px;text-align:center;margin-bottom:16px;font-weight:700;}

/*! CSS Used from: https://slagerijverstappen.online/css/aatventure-theme-2023.css */

.modalbody-aatventure .form-control{background-color:#292D3A!important;color:#FFFFFF!important;}
.modalbody-aatventure{background-color:#161F28!important;}
.modal-remark {background-color:#ff2a05;color:#FFFFFF;}
.bestelmodal  {background-color:#292D3A!important;}

.body-slagerij-verstappen .form-control{background-color:#061720!important;border:1px solid #283034!important;}
.body-slagerij-verstappen .procent25{border-right:8px solid #040f15;}

/* ==========================================================================
   final colors ordermodal verstappen!
   ========================================================================== */

.form-control {display: block; width: 100%; height: 35px; padding: .375rem .75rem; font-size: 1rem;
               font-weight: 400; line-height: 1.5; color: #FFFFFF; border-radius: 4px;}

.body-slagerij-verstappen .modal-body   {background-color: #161F28 !important; color:#FFFFFF!important;}
.body-slagerij-verstappen .form-control {background-color: #061720 !important; border: 1px solid #283034 !important; color: #FFFFFF !important;}

/* =======================================================================================
   DEZE IS DE GEBRUIKTE: LITEPICKER!
   ======================================================================================= */

@media (max-width: 768px)  {
     .litepicker {transform-origin: top left; transform: scale(1.4);}
     .datepickerheight {margin-top: 20px; height:410px !important;}
}

@media (min-width: 768px)                         {
     .litepicker {transform-origin: top left; transform: scale(2.0);}
     .datepickerheight {height:540px !important;}
}
   
:root {
   --litepicker-container-months-box-shadow-color: #104054;
   --litepicker-container-months-color-bg:         #161F28;
   --litepicker-month-header-color:                #FFFFFF !important;
   --litepicker-day-color:                         #FFFFFF !important;
   --litepicker-is-today-color:                    #FFFFFF !important;
   --litepicker-is-locked-color:                   #8a9194;
   --litepicker-month-weekday-color:               #E4C4C8;
   --litepicker-button-prev-month-color:           #E4C4C8;
   --litepicker-button-next-month-color:           #E4C4C8;
   --litepicker-button-prev-month-color-hover:     #FFFFFF !important;
   --litepicker-button-next-month-color-hover:     #FFFFFF !important;
   --litepicker-is-end-color-bg:                   #93C813 !important; box-shadow: inset 0px 0px 0px 0px #93C813 !important;
   --litepicker-day-color-hover:                   #104054;
   --litepicker-highlighted-day-color-bg:          #104054;
   --litepicker-highlighted-day-color:             #FFFFFF !important;
 }

   .datepickerheight #datepicker             {display: none;}
   .litepicker                               {font-family: "Roboto Light" !important;}
   .litepicker .container__months            {min-height: 230px; box-shadow: none !important;}
   .month-item-header                        {padding-top: 0px !important;}
   .container__days .day-item                {cursor:pointer;}
   .button-previous-month                    {cursor:pointer !important;}
   .button-next-month                        {cursor:pointer !important;}
   .container__days .day-item.is-highlighted {border-radius: 0 !important;}
   .container__days>div                      {padding: 9px 0 !important;}
   .container__days>a                        {padding: 9px 0 !important;}
   .month-item-weekdays-row>div              {text-transform: uppercase;}
   
 /* ==========================================================================
   LITEPICKER UPDATES (moet nog uit aatventure weightshop!
   ========================================================================== */

   .body-luxury .month-item-header           {background: #161f28; padding-top: 0px !important;}
   .body-luxury .container__months           {background: #161F28 !important;}
   .body-luxury .month-item-weekdays-row>div {background: #111921 !important;color: #FFFFFF !important;}
   .body-luxury .day-item                    {border: 1px solid #12212c;}
   .body-luxury .is-today                    {background: #104054 !important; border-radius: 50% 0% !important;}
   .body-luxury .is-start-date               {background: #8BC34A !important; border-radius: 50% 0% !important;}
   .body-luxury .floatingbutton              {background-color: #021822 !important; border: 1px solid #263740 !important; box-shadow: 2px 2px 3px #022d30 !important;}

/* ==========================================================================
   BEZORGEN OF AFHALEN EN OPSLAANBUTTON
   ========================================================================== */

   .modal .form-group {text-align: left;}
   .w50l {width: 45%; height: 62px; float: left;  text-align: left;}
   .w50r {width: 45%; height: 62px; float: right; text-align: left;}
   .w50l input {display:none;}
   .w50r input {display:none;}
   .procent75 {float:left; width: 70%; margin-left: 5%;}
   .procent25 {float:left; width:25%;}
   label.css-label {background-image: url('../../img/interface/csscheckbox.png'); -webkit-touch-callout: none; user-select: none;}
   input[type=checkbox].css-checkbox + label.css-label {padding-left: 60px; height: 50px; display: inline-block;
         line-height: 50px; background-repeat: no-repeat; background-position: 0 0; font-size: 15px; vertical-align: middle; cursor: pointer;}
   input[type=checkbox].css-checkbox:checked + label.css-label {background-position: 0 -50px;}

   .body-slagerij-verstappen .btn-primary {background: #e17b14 !important; border-color: #000000 !important; color: #FFFFFF !important;}

   @media (width: 375px) and (height: 768px) {.w50l {width:44%!important;}}
   @media (width: 375px) and (height: 768px) {.w50r {width:44%!important;}}

/* ==========================================================================
   OLDSKOOL VERSTAPPEN PICKMEUP WORDT NIET MEER GEBRUIKT!
   ========================================================================== */

.pickmeup {position: relative; touch-action: manipulation; width: 100%; zoom: 157.5%; margin-top: -8px; margin-bottom: -10px; margin-left: -5px; font-family: "Roboto Light";}

.pmu-instance                         {display:block; height:13.8em; padding:.5em; text-align:center; width:15em;}
.pmu-instance nav                     {display:flex; background-color:#000000; color:#eee; height:24px; line-height:24px;}
.pmu-instance nav .pmu-month          {width:100%; font-size:9px; text-align:center;}
.pmu-instance nav *:first-child:hover {color:#88c5eb;}
.pmu-instance .pmu-day-of-week *      {width:100%!important; background-color:#104054; line-height:2.3em !important; font-size:8px;}
.pmu-instance .pmu-days *             {border-left:1px solid #05202d; border-top:1px solid #05202d;}
.pmu-instance .pmu-days:last-child    {border-bottom:1px solid #05202d;}
.pmu-instance .pmu-sunday             {border-right:1px solid #05202d;}
.pmu-instance .pmu-selected           {background:#8BC34A !important; color:#eee;}
.pmu-instance .pmu-day-of-week        {height:18px; cursor:default;}
.pmu-instance .pmu-days *             {display:inline-block; line-height:1.8em; width:32px !important; font-size:12px; padding:2px;}
.pmu-instance .pmu-button             {color:#eee; cursor:pointer; outline:none; text-decoration:none;}
.pmu-instance .pmu-today              {background: #136a9f; color: #FFFFFF !important; border-radius: 50% 0%; opacity: 1 !important;}
.pmu-instance .pmu-not-in-month       {color:#063c54;}
.pmu-instance .pmu-selected           {border-radius:50% 0%;}
.pmu-instance .pmu-years *,.pmu-instance .pmu-months * {display:inline-block;line-height:3.6em;width:3.5em;}
.pmu-instance:first-child .pmu-prev,.pmu-instance:last-child .pmu-next {display:block;}
.pickmeup:not(.pmu-view-months) .pmu-months,.pickmeup:not(.pmu-view-years) .pmu-years {display:none;}
.pmu-instance .pmu-disabled,.pmu-instance .pmu-disabled:hover {color:#878787;cursor:default;}
.pmu-instance:first-child .pmu-prev,.pmu-instance:last-child .pmu-next {display:block; margin-left:10px; margin-right:10px;}

@media (max-width: 768px) {.pickmeup{zoom:130.5%!important;}}
@media (max-width: 380px) {.pickmeup{zoom:124%!important;}}
@media (max-width: 320px) {.pickmeup{zoom:113.7%!important;}}

/* ==========================================================================
   SLICK SLIDER BREAKS OUT OF <UL> SO BE GENTLE!
   ========================================================================== */

.slick-slide img {display: block; object-fit: fill; min-height: 110px;}

@media (max-width: 768px) {
   .aatsflexrow .list-item {padding-left: 20px; padding-right: 20px;}
   .slick-slider           {margin-left: 20px; margin-right: 20px;}
}

