diff --git a/ts/domtools.breakpoints.ts b/ts/domtools.breakpoints.ts
index c75c7f6..7c1683a 100644
--- a/ts/domtools.breakpoints.ts
+++ b/ts/domtools.breakpoints.ts
@@ -8,21 +8,24 @@ export const phone = 340;
 export type TViewport = 'native' | 'desktop' | 'tablet' | 'phablet' | 'phone';
 
 export const getEnvironment = async (): Promise<TViewport> => {
-  const domToolsInstance = await DomTools.setupDomTools();
-  return domToolsInstance.domToolsStatePart.getState().virtualViewport;
+  if (globalThis.deesDomTools && globalThis.deesDomTools.domToolsStatePart.getState().virtualViewport) {
+    return globalThis.deesDomTools.domToolsStatePart.getState().virtualViewport;
+  } else {
+    return 'native';
+  }
 };
 
-export const cssForTablet = async contentArg => {
-  if ((await getEnvironment()) === 'native' || (await getEnvironment()) === 'desktop') {
+export const cssForTablet = async (contentArg) => {
+  if (getEnvironment() === 'native' || getEnvironment() === 'desktop') {
     return `
       @media (max-width: ${tablet}px) {
         ${contentArg}
       }
     `;
   } else if (
-    (await getEnvironment()) === 'tablet' ||
-    (await getEnvironment()) === 'phablet' ||
-    (await getEnvironment()) === 'phone'
+    getEnvironment() === 'tablet' ||
+    getEnvironment() === 'phablet' ||
+    getEnvironment() === 'phone'
   ) {
     return `
       @media (min-width: 0px) {
@@ -32,14 +35,14 @@ export const cssForTablet = async contentArg => {
   }
 };
 
-export const cssForPhablet = async contentArg => {
-  if ((await getEnvironment()) === 'native' || (await getEnvironment()) === 'desktop') {
+export const cssForPhablet = async (contentArg) => {
+  if (getEnvironment() === 'native' || getEnvironment() === 'desktop') {
     return `
       @media (max-width: ${phablet}px) {
         ${contentArg}
       }
     `;
-  } else if ((await getEnvironment()) === 'phablet' || (await getEnvironment()) === 'phone') {
+  } else if (getEnvironment() === 'phablet' || getEnvironment() === 'phone') {
     return `
       @media (min-width: 0px) {
         ${contentArg}
@@ -48,14 +51,14 @@ export const cssForPhablet = async contentArg => {
   }
 };
 
-export const cssForPhone = async contentArg => {
-  if ((await getEnvironment()) === 'native' || (await getEnvironment()) === 'desktop') {
+export const cssForPhone = async (contentArg) => {
+  if (getEnvironment() === 'native' || getEnvironment() === 'desktop') {
     return `
       @media (max-width: ${phone}px) {
         ${contentArg}
       }
     `;
-  } else if ((await getEnvironment()) === 'phone') {
+  } else if (getEnvironment() === 'phone') {
     return `
       @media (min-width: 0px) {
         ${contentArg}