/* 2 - Carousel CSS */
			
			/* Main Carousel */
				.carousel { /* Whole carousel area */
					margin-bottom: -2px;
					overflow: hidden;
				}

				@media (max-width: 768px) { /* Remove odd margins for mobile devices to prevent overlap */
						.carousel {
							margin-bottom: 22px;
						}
				}

				.carousel-caption { /* Captioned text area */
					left: 58.333333%;
					top: 0;
					height: 100%;
					width: 41.66666666%;
					text-shadow: none;
					text-align: right;
					padding: 2%;
					color: white;
					background: rgba(32, 79, 121, 0.8);
					z-index:0;
				}		

				.carousel-caption h1, .carousel-caption h2, .carousel-caption h3, .carousel-caption h4, .carousel-caption h5, .carousel-caption h6 { /* Override header colours to white in carousel captions */
					color: white !important;
					font-size: 0.9em;
					
				}
				.carousel-caption::before { /* Triangle to the left of the caption to create 'slope' */
					content: " ";
					position: absolute;
					top: 0;
					right: 100%;
					width: 0;
					height: 0;
					border-bottom: 375px solid rgba(32, 79, 121,0.8);
					border-left: 216px solid transparent;
				}
				.carousel-indicators { /* Dots to move from slide to slide */
					left: 0;
					width: calc(100% - 40px);
					margin: 0;
					text-align: right;
				}
			/* Carousel font sizes on different screen sizes */
				@media (max-width:1200px) {		/* Med-Large screens */
						.carousel-caption h5 {
							font-size: 100%;
						}
				}		
				@media (max-width:990px) {	/* Tablet */
						.carousel-caption h5 {
							font-size: 90%;
						}
				}
				@media (max-width:768px) {	/* Mobile */
						.carousel-caption h5 {
							font-size: 100%;
							font-weight: bold;
						}
						.carousel-caption {
							font-size: 90%;
						}
				}
				@media (max-width:420px) {	/* Small Mobile */
						.carousel-caption h5 {
							font-size: 90%;
							font-weight: bold;
						}
						.carousel-caption {
							font-size: 70%;
						}
				}

			/* Emphasis */
				.gold {
					color: #e9c447;
				}