/* 1. Use a more-intuitive box-sizing model */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 2. Remove default margin */
* {
  margin: 0;
}

body {
  /* 3. Add accessible line-height */
  line-height: 1.5;
  /* 4. Improve text rendering */
  -webkit-font-smoothing: antialiased;
  color: white;
  font-family: "komet", sans-serif;
  font-weight: 500;
  font-style: normal;
}

body.home-page{ 
  background: url('../images/bg.png') repeat center center fixed;
}

/* 5. Improve media defaults */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

/* 6. Inherit fonts for form controls */
input, button, textarea, select {
  font: inherit;
}

/* 7. Avoid text overflows */
p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

/* 8. Improve line wrapping */
p {
  text-wrap: pretty;
}
h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

/*
  9. Create a root stacking context
*/
#root, #__next {
  isolation: isolate;
}

.loader {
  width: 50px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 8px solid #9d602e;
  animation:
    l20-1 0.8s infinite linear alternate,
    l20-2 1.6s infinite linear;
}
@keyframes l20-1{
   0%    {clip-path: polygon(50% 50%,0       0,  50%   0%,  50%    0%, 50%    0%, 50%    0%, 50%    0% )}
   12.5% {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100%   0%, 100%   0%, 100%   0% )}
   25%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 100% 100%, 100% 100% )}
   50%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
   62.5% {clip-path: polygon(50% 50%,100%    0, 100%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
   75%   {clip-path: polygon(50% 50%,100% 100%, 100% 100%,  100% 100%, 100% 100%, 50%  100%, 0%   100% )}
   100%  {clip-path: polygon(50% 50%,50%  100%,  50% 100%,   50% 100%,  50% 100%, 50%  100%, 0%   100% )}
}
@keyframes l20-2{ 
  0%    {transform:scaleY(1)  rotate(0deg)}
  49.99%{transform:scaleY(1)  rotate(135deg)}
  50%   {transform:scaleY(-1) rotate(0deg)}
  100%  {transform:scaleY(-1) rotate(-135deg)}
}


p, address, li, span {
  color: white;
  font-family: "komet", sans-serif;
  font-weight: 500;
  font-style: normal;
}

li {
  list-style: none;
}

.content {
  margin: 0 auto;
  text-align: center;
  /* max-width: 200px; */
}
.logo {
  margin: 0 auto;
  width: 100%;
  max-width: 160px;
}

.logo img {
  margin-top: 30px;
}

.loader {
  margin: 50px auto 0;
}

.links {
  margin: 30px auto;
  padding-left: 0;
  max-width: 320px;
  width: 100%;
}

.links ul {
  padding-left: 0;
}

#myVideo {
  display: none;
  height: 100vh;
  width: auto;
}

@media screen and (min-width: 992px) {
  .links {
    max-width: 660px;
  }
}

.link {
  display: flex;
  border: 1px solid white;
  padding: 10px;
  border-radius: 20px;
  margin-bottom: 10px;
  color: white;
  text-decoration: none;
  align-items: center;
}

.link img {
  max-width: 40px;
  margin-right: 15px;
}

.rounded-circle {
  border-radius: 50% !important;
  width: 100px;
  height: 100px;
}

.company-info {
  margin: 30px auto 0;
  max-width: 400px;
  text-align: center;
}

.company-info address {
  margin-bottom: 0;
}

.company-info p {
  margin: 0;
}

.store-hours {
  margin: 30px auto 0;
  max-width: 400px;
  text-align: center;
}

.store-hours span {
  display: block;
}

footer {
  margin: 30px auto 0;
  max-width: 360px;
  text-align: center;
}