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


@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;600;700&display=swap');

html
{
    font-family: Poppins !important;
    font-weight: 300;
    scroll-behavior: smooth;
}
.shadowbg {
box-shadow: 5px 5px 15px #D1D9E6, -5px -5px 15px #ffffff;
background: #ffffff;
border-radius: 5px;
}
.shadowbg2
{
  box-shadow: 5px 5px 15px #D1D9E6, -5px -5px 15px #ffffff;
  border-radius: 5px;
}
.shadowbgbox
{
  box-shadow: 5px 5px 15px #D1D9E6, -5px -5px 15px #ffffff;
}
.shadowbg2:hover
{
  /* background: #1e40af; */
  background: linear-gradient(90deg, rgb(0, 56, 236) 0%, rgb(28, 81, 255) 35%, rgb(2, 37, 151) 100%);
  color: #fff;
}
.menulist li
{
    background: url(../img/up-arrow.png) no-repeat scroll 0 18px;
    background-size: 12px;
    padding-left: 25px;
}
.gradiant
{
  background: linear-gradient(145deg, #ffffff, #e2e8ec);
}
.gradiantbox
{
  background: linear-gradient(145deg, #ffffff, #e2e8ec);
}

.type {
    display:inline-flex;
  }
  
  .type span
  {
    word-break: break-all;
    height: 1em;
    width:0%;
    overflow: hidden;
    animation:t 2s linear infinite alternate;
  }
    @keyframes t{
    90%,100% {width:100%}
}
.linebreak
{
  border-left: #d9dee2 solid 5px;
}
.educationbox::after
{
    position: absolute;
    content: ".";
    width: 20px;
    height: 20px;
    border: 4px solid #1e40af;
    border-radius: 100%;
    left: -32px;
    top: 55px;
    transform: translateY(-7px);
    transition: var(--transition);
}

.window {
  width: 100%;
  margin: auto;
  cursor: n-resize;

  img {
    width: 100%;
    object-fit: cover;
    object-position: top;
    height: 270px;
    transition: 8s all ease;

    &:hover {
      object-position: bottom;
    }
  }
}


@media screen and (max-width: 480px){

.shadowbg {
  box-shadow: none;
  background: #ffffff;
}
.menulist
{
  width: 100%;
  left: 0px;
  padding: 0px 10px 10px 25px;
  background: #fff;
}  

}