/*~~~~~~~~~~~~~~~~~~~~~~ footer starts ~~~~~~~~~~~~~~~~~~~~~~*/
footer {
    background: #B12028;
    height: 210px;
    max-width: 100%;
    position: relative;
    padding: 30px 0;
  }
  #an_logo{
    width: 35%;
  }
.footer-logo {
    line-height: 120px;
    margin-left: 120px;
    float: left;
    margin-right: 80px;
  
  }
  .footer-logo img{
    width: 180px;
    }
  .site{
    position: absolute;
    bottom: 10px;
    margin-left: calc( 50% - 197px );
    color: white;
    white-space: nowrap;
    font-size: 12px;
  }
  .footer-item {
    float: left;
  }
  footer ul li {
    display: inline-block;
    line-height: 120px;
    width: 144px;
  }

  .footer-item a{
    color:white;
  }
  .footer-left-logo{
    float: right;
    margin-right: 120px;
  }
  .footer-ul{
    height: 120px;
  }
  footer ul li a {
    color: white;
    font-size: 25px;
    font-weight: bolder;
    position: relative;
  }
  .footer-title{
    text-align: center;
    position: relative;
  }
  .footer-title img{
    width: 50%;
  }
  .vertical-line{
    border-left: 1px solid white;
    height: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
  .vertical-line-right .vertical-line{
    transform: translateY(calc( -50% - 6px ));
  
  }
  .bottom-line {
    position: relative;
    top: -20px;  
    border:2px solid white;
    background: white;
    transform:scale(0,1);
    transition: transform ease-in-out 250ms; 
  }
  footer a:hover .bottom-line {
    transform:scale(.8,1);
  }
  @media (max-width: 1410px) {
  .footer-logo{
    margin-left: 20px;
    margin-right: 30px;

  }
  .footer-item li{
    width: 130px;
  }
.vertical-line-right{
  width: 20px ;
}
/* footer ul li {

    width: 115px;
} */
  .footer-left-logo{
    margin-right: 0;
  }
  }
  @media (max-width: 1100px) {
    .footer-logo {
      margin-left: -90px;
      position: absolute;
      left: 50%;
      line-height: 0px;
  }
    .footer-item {
      display: none;
    }
    .footer-left-logo {
      position: absolute;
      width: 300px;
      left: 50%;
      margin-right: 0;
      margin-left: -150px;
      margin-top: 30px;
  }
  .site{
    /* padding:0 30px; */
    text-align: center;
  }

  footer{
    padding: 15px 0;
  }
    }


  @media (max-width: 768px) {
    .footer-item{
        display: none;
    }
    .footer-logo{
      margin-right: 0;
    }
}
  /* ~~~~~~~~~~~~~~~~~~~~ footer ends ~~~~~~~~~~~~~~~~~~~~~*/