diff --git a/apps/scandic-web/components/Blocks/UspGrid/uspgrid.module.css b/apps/scandic-web/components/Blocks/UspGrid/uspgrid.module.css
index be5ceb565..5ac39146c 100644
--- a/apps/scandic-web/components/Blocks/UspGrid/uspgrid.module.css
+++ b/apps/scandic-web/components/Blocks/UspGrid/uspgrid.module.css
@@ -9,7 +9,7 @@
   align-content: start;
 }
 
-@media screen and (min-width: 767px) {
+@media screen and (min-width: 768px) {
   .grid {
     grid-template-columns: repeat(2, 1fr);
   }
diff --git a/apps/scandic-web/components/Footer/Details/details.module.css b/apps/scandic-web/components/Footer/Details/details.module.css
index f09fe2301..bac5eb2fc 100644
--- a/apps/scandic-web/components/Footer/Details/details.module.css
+++ b/apps/scandic-web/components/Footer/Details/details.module.css
@@ -56,7 +56,7 @@
   gap: var(--Spacing-x1);
 }
 
-@media screen and (min-width: 767px) {
+@media screen and (min-width: 768px) {
   .details {
     padding: var(--Spacing-x6) 0 var(--Spacing-x4);
   }
diff --git a/apps/scandic-web/components/Footer/Navigation/SecondaryNav/secondarynav.module.css b/apps/scandic-web/components/Footer/Navigation/SecondaryNav/secondarynav.module.css
index e4d1117ee..9533041a3 100644
--- a/apps/scandic-web/components/Footer/Navigation/SecondaryNav/secondarynav.module.css
+++ b/apps/scandic-web/components/Footer/Navigation/SecondaryNav/secondarynav.module.css
@@ -33,7 +33,7 @@
   text-decoration: none;
 }
 
-@media screen and (min-width: 767px) {
+@media screen and (min-width: 768px) {
   .secondaryNavigation {
     margin-top: var(--Spacing-x4);
     gap: 120px;
diff --git a/apps/scandic-web/components/Footer/Navigation/navigation.module.css b/apps/scandic-web/components/Footer/Navigation/navigation.module.css
index b0fa61947..34d324246 100644
--- a/apps/scandic-web/components/Footer/Navigation/navigation.module.css
+++ b/apps/scandic-web/components/Footer/Navigation/navigation.module.css
@@ -11,7 +11,7 @@
   max-width: var(--max-width-page);
 }
 
-@media screen and (min-width: 767px) {
+@media screen and (min-width: 768px) {
   .section {
     padding: var(--Spacing-x9) 0;
   }
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
index 99034d6b7..03cf14731 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css
@@ -71,7 +71,7 @@
   }
 }
 
-@media screen and (min-width: 768px) and (max-width: 1367px) {
+@media screen and (min-width: 768px) and (max-width: 1366px) {
   .container {
     display: flex;
   }
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
index 326f6a3f5..ee331e6ba 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
@@ -31,7 +31,7 @@ const invalidBookingCodeMsg = "Invalid booking code"
 export default function BookingCode() {
   const intl = useIntl()
   const checkIsTablet = useMediaQuery(
-    "(min-width: 768px) and (max-width: 1367px)"
+    "(min-width: 768px) and (max-width: 1366px)"
   )
   const checkIsDesktop = useMediaQuery("(min-width: 1367px)")
   const [isTablet, setIsTablet] = useState(false)
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/formContent.module.css b/apps/scandic-web/components/Forms/BookingWidget/FormContent/formContent.module.css
index cbf757386..2878fc9a1 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/formContent.module.css
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/formContent.module.css
@@ -31,7 +31,7 @@
   }
 }
 
-@media screen and (max-width: 1367px) {
+@media screen and (max-width: 1366px) {
   .inputContainer {
     display: grid;
     gap: var(--Spacing-x2);
diff --git a/apps/scandic-web/components/HotelReservation/HotelCardDialogListing/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCardDialogListing/index.tsx
index caffc6f74..2cf3e5c83 100644
--- a/apps/scandic-web/components/HotelReservation/HotelCardDialogListing/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/HotelCardDialogListing/index.tsx
@@ -29,7 +29,7 @@ export default function HotelCardDialogListing({
   const activeCardRef = useRef<HTMLDivElement | null>(null)
   const observerRef = useRef<IntersectionObserver | null>(null)
   const dialogRef = useRef<HTMLDivElement>(null)
-  const isMobile = useMediaQuery("(max-width: 768px)")
+  const isMobile = useMediaQuery("(max-width: 767px)")
   const { activeHotelCard, setActiveHotelCard, setActiveHotelPin } =
     useHotelsMapStore()
 
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/selectedRoomPanel.module.css b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/selectedRoomPanel.module.css
index d25a70aff..5042cb6ef 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/selectedRoomPanel.module.css
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/selectedRoomPanel.module.css
@@ -33,7 +33,7 @@ div.selectedRoomPanel p.subtitle {
   padding-bottom: var(--Spacing-x1);
 }
 
-@media screen and (max-width: 768px) {
+@media screen and (max-width: 767px) {
   .selectedRoomPanel {
     gap: var(--Spacing-x1);
     grid-template-areas: "image" "content";
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/multiRoomWrapper.module.css b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/multiRoomWrapper.module.css
index 29bd3d6c2..33419ade0 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/multiRoomWrapper.module.css
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/multiRoomWrapper.module.css
@@ -48,7 +48,7 @@
   display: none;
 }
 
-@media (max-width: 768px) {
+@media (max-width: 767px) {
   .roomContainer {
     padding: var(--Spacing-x2);
   }
diff --git a/apps/scandic-web/components/Lightbox/Lightbox.module.css b/apps/scandic-web/components/Lightbox/Lightbox.module.css
index b95d4fad5..22f98fe5c 100644
--- a/apps/scandic-web/components/Lightbox/Lightbox.module.css
+++ b/apps/scandic-web/components/Lightbox/Lightbox.module.css
@@ -199,7 +199,7 @@
 .image {
   object-fit: cover;
 }
-@media (min-width: 768px) and (max-width: 1367px) {
+@media (min-width: 768px) and (max-width: 1366px) {
   .fullViewContainer {
     padding: var(--Spacing-x5);
   }
diff --git a/apps/scandic-web/components/TempDesignSystem/Tooltip/tooltip.module.css b/apps/scandic-web/components/TempDesignSystem/Tooltip/tooltip.module.css
index b0ae8cf4f..361139464 100644
--- a/apps/scandic-web/components/TempDesignSystem/Tooltip/tooltip.module.css
+++ b/apps/scandic-web/components/TempDesignSystem/Tooltip/tooltip.module.css
@@ -142,7 +142,7 @@
   border-color: transparent var(--UI-Text-Active) transparent transparent;
 }
 
-@media screen and (max-width: 768px) {
+@media screen and (max-width: 767px) {
   .tooltipContainer[data-active="true"] .tooltip {
     visibility: visible;
     opacity: 1;
diff --git a/apps/scandic-web/hooks/booking/useScrollToActiveSection.ts b/apps/scandic-web/hooks/booking/useScrollToActiveSection.ts
index c329034a9..853bbfbcb 100644
--- a/apps/scandic-web/hooks/booking/useScrollToActiveSection.ts
+++ b/apps/scandic-web/hooks/booking/useScrollToActiveSection.ts
@@ -8,7 +8,7 @@ export default function useScrollToActiveSection(
   steps: StepEnum[],
   isActive: boolean
 ) {
-  const isMobile = useMediaQuery("(max-width: 768px)")
+  const isMobile = useMediaQuery("(max-width: 767px)")
 
   const handleScroll = useCallback(() => {
     if (!isMobile) {