@tailwind base;
@tailwind components;
@tailwind utilities;



body > div.w-screen.flex.justify-center.bg-black.flex-col.items-center > p{
    width: 50%;
    text-align: center;
    padding: 10px;
}

body > div.w-screen.flex.justify-center.bg-black.flex-col.items-center > h1 {
    margin-top: 70px;
    font-size: 24px;
}

body > div.h-\[100vh\].bg-black.w-full.flex.justify-center.items-center > div > div:nth-child(1) > div:nth-child(1){
    background-image: url('./images/services.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    border: solid;
    border-color: rgb(16, 1, 16);
}
body > div.h-\[100vh\].bg-black.w-full.flex.justify-center.items-center > div > div:nth-child(1) > div:nth-child(2){
    background-image: url('./images/innovation.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    border: solid;
    border-color: rgb(16, 1, 16);
}

body > div.h-\[100vh\].bg-black.w-full.flex.justify-center.items-center > div > div:nth-child(2) > div:nth-child(1){
    background-image: url('./images/industries.gif');
    background-repeat: no-repeat;
    background-size: cover;
    border: solid;
    border-color: rgb(16, 1, 16);
}
body > div.h-\[100vh\].bg-black.w-full.flex.justify-center.items-center > div > div:nth-child(2) > div:nth-child(2){
    background-image: url('./images/about.jpeg');
    background-repeat: no-repeat;
    background-size: cover;
    border: solid;
    border-color: rgb(16, 1, 16);
}
body > div.h-\[100vh\].bg-black.w-full.flex.justify-center.items-center > div > div:nth-child(2) > div:nth-child(3){
    background-image: url('./images/contact.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    border: solid;
    border-color: rgb(16, 1, 16);
}


body > div.h-\[100vh\].bg-black.w-full.flex.justify-center.items-center.mt-10 {
    margin-top: 50px;
}

.font-oswald {
    font-family: Oswald;
}


.zooming-div {
    /* width: 300px;
    height: 300px; */
    overflow-x: hidden;
    background-image: url('./images/bgyellow.png');
    background-size: cover;
    animation: zoomAnimation 5s ease-in-out infinite;
}

@keyframes zoomAnimation {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}


::-webkit-scrollbar {
    width: 10px;
    height: 16px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    border-radius: 100vh;
    background: #edf2f7;
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #8c8c88;
    border-radius: 100vh;
    border: 2px solid #edf2f7;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
  }
  
  @supports (-webkit-touch-callout: none) {
    .h-screen {
      height: -webkit-fill-available;
    }
  }


  body {
    animation: fadeInAnimation ease-in 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


.dropdown {
    position: relative;
    display: inline-block;
  }
  
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: white;
    min-width: 160px;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  .dropdown-content a {
    color: black;
    padding: 10px 16px;
    text-decoration: none;
    display: block;
  }
  
  .dropdown-content a:hover {background-color: #ddd;}
  
  .dropdown:hover .dropdown-content {display: block;}
  
  .dropdown:hover .dropbtn {background-color: white;
  color : black}