body{
  background: linear-gradient(45deg, #02c4ff, #fcb2e3);
  color:#000000;
  font-family: 'Times New Roman', Times, serif;
}

.box{
  background-image: url(/Users/kanon/Desktop/Assignment/Image/car.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top;
  margin: 10px;
  border: 10px solid black;
  border-style: inset;
}
.service img {
  width: 300px;
  height: auto;
}

.fulloverlay{
  position: fixed;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(68, 68, 68, 0.8);
  z-index: 2147483647;
  opacity: 0.5;
}

header{
  color:rgb(255, 255, 255);
  width: 100%;
  font-family: 'Times New Roman', Times, serif;
  padding-top: 270px;
  text-align: center;
  font-size: 40px;
  text-transform: uppercase;
}

section{
  color: rgb(255, 106, 106);
  text-decoration: none;
  font-size: 1.2rem;
  text-transform: uppercase;
  width: 100%;
  margin: 0px;
  margin-top: 30px;
  margin-bottom: 40px;
  text-align: center;
  position: absolute;
}

.menu{
  color: #000;
  display:flex;
  gap: 1rem; 
  margin:0;
  padding:0;
  list-style: none;
}

.menu li{
  display: inline;
  width: max-content;
  flex-grow: 1;
  flex-shrink: 1;
}

aside{
  background-color: white;
  width:100%;
  margin-top: 0px;
  padding: 0px;
  padding-top: 100px;
  padding-bottom: 50px;
}

.columns{
  column-count: 2;
  column-rule: 1px dotted rgb(0, 0, 0);
  column-gap: 3em;
}

/* On screens that are 1080px or less, set the background color to blue */
@media screen and (max-width: 1200px) {
  body {
    background-color: rgb(255, 255, 255);
  }
}

/* On screens that are 550px or less, set the background color to blue */
@media screen and (max-width: 768px) {
  body {
    background-color: rgb(255, 255, 255);
  }
  /* Navbar links */
  .menu{
    font-size: 15px;
    padding: 40px;
    padding-left: 10px;
    flex: 50%;
    width: 10px;
    color: white;
    text-align: center;
    text-decoration: none;
  }
  h1{
    font-size: 40px;
  }
  .pic1{
      width: 100%;
      height: auto;
    }
  }
  video {
    max-width: 100%;
    height: auto;
  }
  
  .company{
    transition-property: width;
    transition-duration: 2s;
    transition-timing-function: linear;
    transition-delay: 1s;
  }
  
/* The element to apply the animation to */
.company1{
  width: 1010px;
  height: 800px;
  background-color: rgb(248, 0, 0);
  animation-name: example;
  animation-duration: 10s;
}

.overflow-wrap{
  display: flex;
  margin-bottom: 10rem;
}

footer{
  background-color: #7e7e7e;
  width: 320spx;
  padding: 10px;
  text-align: center;
}