#banner {
  height: 980px;
  width: 100%;
  overflow: hidden;
  position: relative;
  border: solid 5px #ED1E65; }
  #banner .banner-open {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    z-index: 99;
    margin: auto;
    width: 631px;
    height: 253px; }
  #banner .table {
    display: flex;
    width: 100%;
    height: 100%; }
  #banner .table__cell {
    position: relative;
    display: flex;
    width: 20%;
    align-items: flex-end;
    justify-content: center;
    transition: width 500ms cubic-bezier(0.4, 0, 0.2, 1);
    border-right: solid 8px #FFF;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    /*  &:hover span {
       opacity: 1;
       transition-delay: 300ms;
     } */ }
    /* #banner .table__cell:nth-child(3) {
      background-image: url(../images/banner-pic3.jpg); } */
    /* #banner .table__cell:nth-child(5) {
      background-image: url(../images/banner-pic5.jpg);
      border-right: none; } */
    #banner .table__cell:hover {
      width: 22%; }
      #banner .table__cell:hover a {
        color: #FFFFFF; }
        #banner .table__cell:hover a::before {
          height: 100%; }
    #banner .table__cell a {
      opacity: 1;
      transition: opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);
      transition-delay: 0;
      background-color: #FFF;
      display: inline-block;
      padding: 10px 10px;
      width: 150px;
      text-align: center;
      color: #ED1E65;
      font-style: italic;
      font-weight: 600;
      margin-bottom: 200px;
      position: relative; }
      #banner .table__cell a::before {
        content: '';
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 0%;
        background-color: #97144D;
        transition: height 200ms cubic-bezier(0.4, 0, 0.2, 1); }
      #banner .table__cell a:hover {
        color: #FFFFFF; }
        #banner .table__cell a:hover::before {
          height: 100%; }
      #banner .table__cell a span {
        position: relative;
        z-index: 9; }
  #banner svg {
    font-family: 'Lato', sans-serif !important;
    position: absolute;
    width: 100%;
    height: 100%;
    fill: #FFFFFF; }
  #banner svg text {
    animation: stroke 3s alternate;
    stroke-width: 0;
    stroke: #FFFFFF;
    font-size: 450px;
    font-weight: 700;
    font-style: italic; }
@keyframes stroke {
  0% {
    fill: rgba(255, 255, 255, 0);
    stroke: white;
    stroke-dashoffset: 25%;
    stroke-dasharray: 0 50%;
    stroke-width: 2;
    transform: scale(1.5); }
  70% {
    fill: rgba(255, 255, 255, 0);
    stroke: white; }
  80% {
    fill: rgba(255, 255, 255, 0);
    stroke: white;
    stroke-width: 3; }
  100% {
    fill: white;
    stroke: white;
    stroke-dashoffset: -25%;
    stroke-dasharray: 50% 0;
    stroke-width: 0;
    transform: scale(1); } }
  #banner .banner-top-vet {
    position: absolute;
    top: 32px;
    z-index: 9;
    display: block;
    width: 100%; }
    #banner .banner-top-vet .common-container {
      position: absolute;
      margin: auto;
      left: 0px;
      right: 0px;
      top: 0;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding-top: 70px; }
      #banner .banner-top-vet .common-container p {
        font-size: 22px;
        color: #000;
        font-style: italic;
        z-index: 9;
        top: 0px; }



.whitetitle-glance-2 {
    color: #ED1E65;
    font-weight: 500;
    font-size: 34px;
    font-style: italic;
}

.msgbox22 {
    background: #f5f5f5;
    border-top: 6px solid #ED1E65;
    padding: 20px;
    border-bottom: 2px solid #ED1e65;
}
.pd-l-15 { padding-left: 15px; }

.pink-border {  border-left: 1px solid #ed1e65; border-right: 1px solid #ed1e65; }
.pink-border2  {  border-top: 6px solid #ed1e65; }
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {

#banner {
    height: auto; }

  #banner .table {
    width: 100%;
    display: block; }

  #banner .table__cell {
    display: inline-block;
    width: 50%;
    border: solid 1px #FFF;
    height: 320px;
    float: left;
    align-items: inherit;
    background-position: top center; }
    #banner .table__cell:last-child {
      width: 100%;
      background-position: 50% 27%; }

  #banner .table__cell a {
    position: absolute;
    bottom: 20px;
    left: 0px;
    right: 0px;
    margin: auto; }

  #banner svg {
    width: 100%;
    height: 100%;
    margin: auto;
    left: 0px;
    right: 0px;
    transform: translate(0px, -50px); }

#banner .banner-open {
    width: 100%;
    height: auto;
  }

}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {

  #banner {
    height: auto; }

  #banner .table {
    width: 100%;
    display: block; }

  #banner .table__cell {
    display: inline-block;
    width: 50%;
    border: solid 1px #FFF;
    height: 320px;
    float: left;
    align-items: inherit; }
    #banner .table__cell:last-child {
      width: 100%;
      background-position: 50% 27%; }

  #banner .table__cell a {
    position: absolute;
    bottom: 20px;
    left: 0px;
    right: 0px;
    margin: auto; }

  #banner svg {
    width: 65%;
    height: 100%;
    margin: auto;
    left: 0px;
    right: 0px; }

}