/* Black */
@font-face {
  font-family: 'ATTAleckSans-Black';
  src: url("./ATTAleckSans-Black.woff2") format("woff2"), url("./ATTAleckSans-Black.woff") format("woff");
  font-style: normal;
  font-weight: normal;
}
@font-face {
  font-family: 'ATTAleckSans-Black';
  src: url("./ATTAleckSans-BlackItalic.woff2") format("woff2"), url("./ATTAleckSans-BlackItalic.woff") format("woff");
  font-style: italic;
  font-weight: normal;
}

/* Bold */
@font-face {
  font-family: 'ATTAleckSans-Bold';
  src: url("./ATTAleckSans-Bold.woff2") format("woff2"), url("./ATTAleckSans-Bold.woff") format("woff");
  font-style: normal;
  font-weight: normal;
}
/* Bold Bold(ed) Overrides */
@font-face {
  font-family: 'ATTAleckSans-Bold';
  src: url("./ATTAleckSans-Black.woff2") format("woff2"), url("./ATTAleckSans-Black.woff") format("woff");
  font-style: normal;
  font-weight: bold;
}
@font-face {
  font-family: 'ATTAleckSans-Bold';
  src: url("./ATTAleckSans-BlackItalic.woff2") format("woff2"), url("./ATTAleckSans-BlackItalic.woff") format("woff");
  font-style: italic;
  font-weight: bold;
}
/* Bold Italics */
@font-face {
  font-family: 'ATTAleckSans-Bold';
  src: url("./ATTAleckSans-BoldItalic.woff2") format("woff2"), url("./ATTAleckSans-BoldItalic.woff") format("woff");
  font-style: italic;
  font-weight: normal;
}

/* Medium */
@font-face {
  font-family: 'ATTAleckSans-Medium';
  src: url("./ATTAleckSans-Medium.woff2") format("woff2"), url("./ATTAleckSans-Medium.woff") format("woff");
  font-style: normal;
  font-weight: normal;
}
/* Medium Bold Overrides */
@font-face {
  font-family: 'ATTAleckSans-Medium';
  src: url("./ATTAleckSans-Black.woff2") format("woff2"), url("./ATTAleckSans-Black.woff") format("woff");
  font-style: normal;
  font-weight: bold;
}
@font-face {
  font-family: 'ATTAleckSans-Medium';
  src: url("./ATTAleckSans-BlackItalic.woff2") format("woff2"), url("./ATTAleckSans-BlackItalic.woff") format("woff");
  font-style: italic;
  font-weight: bold;
}
/* Medium Italics */
@font-face {
  font-family: 'ATTAleckSans-Medium';
  src: url("./ATTAleckSans-MediumItalic.woff2") format("woff2"), url("./ATTAleckSans-MediumItalic.woff") format("woff");
  font-style: italic;
  font-weight: normal;
}

/* Regular */
@font-face {
  font-family: 'ATTAleckSans';
  src: url('./ATTAleckSans-Regular.woff2') format('woff2'), url('./ATTAleckSans-Regular.woff') format('woff');
  font-weight: normal;
}
@font-face {
  font-family: 'ATTAleckSans';
  src: url('./ATTAleckSans-Bold.woff2') format('woff2'), url('./ATTAleckSans-Bold.woff') format('woff');
  font-weight: bold;
}
@font-face {
  font-family: 'ATTAleckSans';
  src: url('./ATTAleckSans-Italic.woff2') format('woff2'), url('./ATTAleckSans-Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: 'ATTAleckSans';
  src: url('./ATTAleckSans-BoldItalic.woff2') format('woff2'), url('./ATTAleckSans-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
}

/* Regular Alt Name */
@font-face {
  font-family: 'ATTAleckSans-Regular';
  src: url('./ATTAleckSans-Regular.woff2') format('woff2'), url('./ATTAleckSans-Regular.woff') format('woff');
  font-weight: normal;
}
@font-face {
  font-family: 'ATTAleckSans-Regular';
  src: url('./ATTAleckSans-Bold.woff2') format('woff2'), url('./ATTAleckSans-Bold.woff') format('woff');
  font-weight: bold;
}
@font-face {
  font-family: 'ATTAleckSans-Regular';
  src: url('./ATTAleckSans-Italic.woff2') format('woff2'), url('./ATTAleckSans-Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: 'ATTAleckSans-Regular';
  src: url('./ATTAleckSans-BoldItalic.woff2') format('woff2'), url('./ATTAleckSans-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
}

/* Light */
@font-face {
  font-family: 'ATTAleckSans-Light';
  src: url("./ATTAleckSans-Light.woff2") format("woff2"), url("./ATTAleckSans-Light.woff") format("woff");
  font-style: normal;
  font-weight: normal;
}
/* Light Bold Overrides */
@font-face {
  font-family: 'ATTAleckSans-Light';
  src: url("./ATTAleckSans-Medium.woff2") format("woff2"), url("./ATTAleckSans-Medium.woff") format("woff");
  font-style: normal;
  font-weight: bold;
}
@font-face {
  font-family: 'ATTAleckSans-Light';
  src: url("./ATTAleckSans-MediumItalic.woff2") format("woff2"), url("./ATTAleckSans-MediumItalic.woff") format("woff");
  font-style: italic;
  font-weight: bold;
}
/* Light Italics */
@font-face {
  font-family: 'ATTAleckSans-Light';
  src: url("./ATTAleckSans-LightItalic.woff2") format("woff2"), url("./ATTAleckSans-LightItalic.woff") format("woff");
  font-style: italic;
  font-weight: normal;
}

/* Thin */
@font-face {
  font-family: 'ATTAleckSans-Thin';
  src: url("./ATTAleckSans-Thin.woff2") format("woff2"), url("./ATTAleckSans-Thin.woff") format("woff");
  font-style: normal;
  font-weight: normal;
}
/* Thin Bold Overrides */
@font-face {
  font-family: 'ATTAleckSans-Thin';
  src: url("./ATTAleckSans-Regular.woff2") format("woff2"), url("./ATTAleckSans-Regular.woff") format("woff");
  font-style: normal;
  font-weight: bold;
}
@font-face {
  font-family: 'ATTAleckSans-Thin';
  src: url("./ATTAleckSans-Italic.woff2") format("woff2"), url("./ATTAleckSans-Italic.woff") format("woff");
  font-style: italic;
  font-weight: bold;
}
/* Thin Italics */
@font-face {
  font-family: 'ATTAleckSans-Thin';
  src: url("./ATTAleckSans-ThinItalic.woff2") format("woff2"), url("./ATTAleckSans-ThinItalic.woff") format("woff");
  font-style: italic;
  font-weight: normal;
}

/* other fonts */
@font-face {
  font-family: 'CabinSketch';
  src: url('./CabinSketch-Regular.ttf') format('truetype');
  font-weight: normal;
}

@font-face {
  font-family: 'CabinSketch';
  src: url('./CabinSketch-Bold.ttf') format('truetype');
  font-weight: bold;
}
.CabinSketch {
  font-family: 'CabinSketch';
}

/* The below font declarations are used by the fiberwizard-client package */

@font-face {
  font-family:'ATT AleckSans Black';
  src:url("./ATTAleckSans-Black.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Black Italic';
  src:url("./ATTAleckSans-BlackItalic.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Bold';
  src:url("./ATTAleckSans-Bold.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Bold Italic';
  src:url("./ATTAleckSans-BoldItalic.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Italic';
  src:url("./ATTAleckSans-Italic.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Light';
  src:url("./ATTAleckSans-Light.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Light Italic';
  src:url("./ATTAleckSans-LightItalic.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Medium';
  src:url("./ATTAleckSans-Medium.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Medium Italic';
  src:url("./ATTAleckSans-MediumItalic.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Regular';
  src:url("./ATTAleckSans-Regular.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Thin';
  src:url("./ATTAleckSans-Thin.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans Thin Italic';
  src:url("./ATTAleckSans-ThinItalic.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}

@font-face {
  font-family:'ATT AleckSans';
  src:url("./ATTAleckSans-Regular.ttf") format("truetype");
  font-style:normal;font-weight: normal;
}
@font-face {
  font-family:'ATT AleckSans';
  src:url("./ATTAleckSans-Italic.ttf") format("truetype");
  font-style:italic;font-weight: normal;
}
@font-face {
  font-family:'ATT AleckSans';
  src:url("./ATTAleckSans-Bold.ttf") format("truetype");
  font-style:normal;font-weight: bold;
}
@font-face {
  font-family:'ATT AleckSans';
  src:url("./ATTAleckSans-BoldItalic.ttf") format("truetype");
  font-style:italic;font-weight: bold;
}



a.button-like {
  display: inline-block; /* Allows setting width/height and margins/padding */
  padding: 2px 5px; /* Adjust padding as needed */
  margin-left: 8px;
  font-size: .8rem; /* Adjust font size */
  font-weight: bold;
  text-align: center;
  text-decoration: none; /* Remove the default underline */
  color: #fff; /* Set text color */
  background-color: #007bff; /* Use a typical button background color */
  border: none; /* Remove default link border */
  border-radius: 5px; /* Add rounded corners */
  cursor: pointer; /* Indicate it's interactive */
  transition: background-color 0.3s ease, color 0.3s ease; /* Smooth hover effect */

  /* Optional: Add a subtle box shadow */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
a.button-like:hover {
  color: lightgray;
  background-color: #0056b3; /* Darker background on hover */
}

a.button-like:focus {
  outline: none; /* Remove default focus outline */
  box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.5); /* Add a custom focus style */
}

a.button-like:active {
  background-color: #004085; /* Even darker on active (mouse click) */
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2); /* Subtle inner shadow on click */
}
body {
  box-sizing: border-box;
  color: #464B51;
  margin: 0;
}
html, body {
  width: 100%;
  height: 100%;
}
html {
  box-sizing: border-box;
  -webkit-tap-highlight-color:transparent;
}
#root {
    background-color: rgba(0,0,0,0.8);
    width: 100%;
  height: 100%;
/*  font-synthesis: weight style;*/
}

.media-block__close-button {
  background: transparent;
  border: none;
  cursor: pointer;
  position: absolute;
  outline: none;
  right: 38px;
  top: 43px;
  z-index: 999;
}