.row-header {
  margin: 0px auto;
  padding: 0px 0px; }

.row-content {
  margin: 0px auto;
  padding: 20px 0px;
  border-bottom: 1px ridge;
  min-height: 400px; }

.footer {
  background-color: #00003E;
  margin: 0px auto;
  padding: 20px 0px; }

.jumbotron {
  margin: 0px auto;
  padding: 20px 20px;
  background: #0b7dda;
  color: floralwhite; }
  
  .myclass {
  color: floralblue; }

address {
  font-size: 80%;
  margin: 0px;
  color: #0f0f0f; }

body {
  padding: 0px 0px 0px 0px;
  z-index: 0; }

.navbar-dark {
  background-color: #512DA8; }

.tab-content {
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 10px; }

.carousel {
  background: #512DA8; }
  .carousel .carousel-item {
    height: 400px; }
    .carousel .carousel-item img {
      position: absolute;
      top: 0;
      left: 0;
      min-height: 400px; }

#carouselButton {
  right: 0px;
  position: absolute;
  bottom: 0px;
  z-index: 1; }

.modal .modal-header {
  background-color: #512DA8;
  color: floralwhite; }
  .modal .modal-header .close {
    color: floralwhite; }

.modal .modal-body {
  background-color: #D1C4E9; }


  #vcmore {display: none;}
  #directormore {display: none;}



  .image-contain {
    background-image: url("front.jpg"); /* The image used - important! */
    background-size: cover;
    position: relative; /* Needed to position the cutout text in the middle of the image */
    
  }
  
  .text {
    background-color: white;
    color: black;
    font-size: 2vw; /* Responsive font size */
    font-weight: bold;
    margin: 0 auto; /* Center the text container */
    padding: 10px;
    width: 70%;
    text-align: center; /* Center text */
    position: absolute; /* Position text */
    top: 50%; /* Position text in the middle */
    left: 50%; /* Position text in the middle */
    transform: translate(-50%, -50%); /* Position text in the middle */
    mix-blend-mode: screen; /* This makes the cutout text possible */
  }


  .rtable, .rth, .rtd {
    border: 1px solid black;
    font-size:1.0vw;

  }

  .menu a {
    position: relative;
    text-decoration: none;
    
  }
  
  .menu a::after {
    position: absolute;
    content: "";
    width: 80%;
    height: 3px;
    top: 100%;
    left: 0;
    background: #ff7000;
    transition: transform 0.5s;
    transform: scaleX(0);
    transform-origin: center;
  }
  
  .menu a:hover::after {
    transform: scaleX(1);
  }
  .mh5{
    font-size: 1.4vw;
  }

  .glow {
    color: #fff;
    text-align: center;
    -webkit-animation: glow 1s ease-in-out infinite alternate;
    -moz-animation: glow 1s ease-in-out infinite alternate;
    animation: glow 1s ease-in-out infinite alternate;
  }
  
  @-webkit-keyframes glow {
    from {
      text-shadow: 0 0 5px #fff, 0 0 7px #fff, 0 0 9px #e60073, 0 0 11px #e60073, 0 0 14px #e60073, 0 0 16px #e60073, 0 0 18px #e60073;
    }
    to {
      text-shadow: 0 0 6px #fff, 0 0 8px #ff4da6, 0 0 10px #ff4da6, 0 0 12px #ff4da6, 0 0 15px #ff4da6, 0 0 17px #ff4da6, 0 0 19px #ff4da6;
    }
  }

  .vinput{
    background-color: #4C5675;
    color:white;
  }
  .vselect{
    background-color: #4C5675;
    color:white;
  }

  .ani {
 
    color: red;
    animation-name: example;
    animation-duration: 2s;
    animation-iteration-count: infinite;
  }
  
  @keyframes example {
    from {color: green;}
    to {color: yellow;}
  }

  #alogin
  {
    font-size: 0.8vw;
  }
  #clogin
  {
    font-size: 0.8vw;
  }


  
			.imgcontainer
			{
				text-align: center;
				margin: 24px 0 12px 0;
			}
			img.avatar
			{
				width: 30%;
				border-radius: 50%;
			}






  .modal .modal-header {
    background-color: #512DA8;
    color: floralwhite; }
    .modal .modal-header .close {
      color: floralwhite; }
  
  .modal .modal-body {
    background-color: #D1C4E9; }

    .back
    {
      background-image: url('back.png');
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
    }