	body {
  		background-color: #FFFEFA;
	}

	section {
  	  	padding-top: 100px;
		padding-bottom: 0px;
  	}

	.footer {   		
   		left: 0;
   		bottom: 0;
   		width: 100%;
		height: 100%;
		background-color: grey;
		color: orange;		
   		text-align: center;
	}
	
	.myHover:hover { 
		color: white;
	}

	 /* Modify navbar the background color */ 
          
        		.navbar-custom { 
            			background-image: linear-gradient(to right, grey, grey); 
        		} 
       	 /* Modify navbar brand and text color */ 
          
        		.navbar-brand{
			color: Orange; 
		}
				
		.navbar-text { 
            			color: white; 
        		} 

		.collapse a:hover {
  			color: white;
  			text-decoration: double overline orange;
		}

		.collapse a.active {
  			background-color: #ffaa00;
  			color: white;
		}

  	/* Make the image fully responsive */
  
		.carousel-inner img {
    			width: 100%;
    			height: 100%;
  		}

		.centered {
  			position: absolute;
  			top: 50%;
  			left: 50%;
  			transform: translate(-50%, -50%);
		}

		img {
    			width: 100%;
			height: 200px;
			padding-bottom: 10px;
		}

		hr{
  			border: 3px solid orange;
			border-radius: 5px;
		}
		
		.mySideHeader{
			color: grey; 					
		}

		.mySideHeader {
  			display: inline-block;
  			position: relative;
  			color: grey;
			font-size: 35px;
			font-family:'Brush Script MT';
			font-weight: bold;			
		}

		.mySideHeader:after {
  			content: '';
  			position: absolute;
  			width: 100%;
  			transform: scaleX(0);
  			height: 3px;
  			bottom: 0;
  			left: 0;
  			background-color: orange;
  			transform-origin: bottom right;
  			transition: transform 0.25s ease-out;
		}

		.mySideHeader:hover:after {
  			transform: scaleX(1);
  			transform-origin: bottom left;
		}

		.hover-myCard {
  			transition: 0.3s;
		}

		.hover-myCard:hover {
  			transform: translate(0, -10px);
		}

		/* Picture comes on front */
		.modal {
  			display: none; /* Hidden by default */
 	 		position: fixed; /* Stay in place */
  			z-index: 1; /* Sit on top */
  			left: 0;
  			top: 0;
  			width: 100%; /* Full width */
  			height: 100%; /* Full height */
  			overflow: auto; /* Enable scroll if needed */
  			background-color: rgb(0,0,0); /* Fallback color */
  			background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  			padding-top: 60px;
			padding-left: 60px;
			padding-right: 60px;
		}
		
		.animate {
  			-webkit-animation: animatezoom 0.6s;
  			animation: animatezoom 0.6s;
 			padding:10px;
		}

		.close {
  			position: absolute;
  			right: 100px;
  			top: 100px;
  			color: white;
  			font-size: 35px;
  			font-weight: bold;
		}

		.close:hover,
		.close:focus {
  			color: orange;
  			cursor: pointer;
		}

		.blink{
			
			text-align: center;
			animation: blinktext
				1.5s linear infinite;
		}

		@keyframes blinktext {
			0% {
				opacity: 0;
			}

			50% {
				opacity: 1;
			}

			100% {
				opacity: 2;
			}
		}

		#background-video-change {
  			width: 100vw;
  			height: 70vh;
  			object-fit: cover;
  			position: fixed;
  			left: 0;
  			right: 0;
  			top: 0;
  			bottom: 0;
  			z-index: -1;
		}

		.video-container {
  			width: 100%;
  			max-height: 500px;
  			overflow: hidden;
  			top: 0;
  			right: 0;
			left: 0;
  			z-index: -100;
			margin-top: -100px;
		}

		#video-bg {
  			width: auto;
  			min-width: 100%;
  			height: auto;
  			background: transparent url(video-bg.jpg) no-repeat;
  			background-size: cover;			
		}

		.carousel-caption{
			top: 7%;
			font-size: 60px;
			font-weight: bold;
			color: grey;
			font-family:'Brush Script MT';
					
		}

		.shake-img:hover {
  			animation: shake 0.5s;
  			animation-iteration-count: 0.5;
			cursor: pointer;
		}

		@keyframes shake {
  			0% { transform: translate(1px, 1px) rotate(0deg); }
  			10% { transform: translate(-1px, -2px) rotate(-1deg); }
  			20% { transform: translate(-3px, 0px) rotate(1deg); }
  			30% { transform: translate(3px, 2px) rotate(0deg); }
  			40% { transform: translate(1px, -1px) rotate(1deg); }
  			50% { transform: translate(-1px, 2px) rotate(-1deg); }
  			60% { transform: translate(-3px, 1px) rotate(0deg); }
  			70% { transform: translate(3px, 1px) rotate(-1deg); }
  			80% { transform: translate(-1px, -1px) rotate(1deg); }
  			90% { transform: translate(1px, 2px) rotate(0deg); }
  			100% { transform: translate(1px, -2px) rotate(-1deg); }
		}

		.disp-text{
  			display: none;
  		}
		@media only screen and (max-width: 767px) {
 
  			.disp-text{
  				display: block;	
				text-align: center;
  			}
		}



		