/* This file basically just contains changes to new-age.css */

/* Horizontal line */
hr {
	background: linear-gradient(to right, #c605c8, purple, blue, #00c4f2);
	height: 2px;
	margin-top: 10px;
	margin-bottom: 10px;
}

body.modal-open {
    overflow: visible;
}

section {
	padding-top: 80px;
	padding-bottom: 50px;
	scroll-margin-top: 62px;
}

section h2 {
	text-transform: uppercase;
	font-weight: 900;
	font-size: 30px;
	margin-bottom: 0;
}

section .heading {
	text-align: center;
}

section .heading-container {
	display: inline-block;
	z-index: 1;
}

a {
	color: #00c4f2;
}

a:hover {
	color: #00c4f2;
}


.Overlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: #4e4c7dDD;
	opacity: 0.8;
	z-index: -1;
}

.purple-button,
.purple-button:hover,
.purple-button:active {
	padding: 10px 20px !important;
	text-align: center !important;
	text-decoration: none !important;
	font-family: Muli, Helvetica, Arial, "sans-serif" !important;
	font-weight: 900;
	outline: none;
	height: auto !important;
	cursor:pointer;
}

.purple-button {
	border-image: url('../img/purple_button/Default.png') !important;
	border-image-slice: 63 255 63 255 fill !important;
	border-image-width: 128px 512px !important;
	border-image-repeat: stretch !important;
	color: #f3e5f3 !important;
}

.purple-button:hover {
	border-image: url('../img/purple_button/Hover.png') !important;
	border-image-slice: 63 255 63 255 fill !important;
	border-image-width: 128px 512px !important;
	border-image-repeat: stretch !important;
	color: #f3e5f3 !important;
}

.purple-button:active {
	border-image: url('../img/purple_button/Pressed.png') !important;
	border-image-slice: 63 255 63 255 fill !important;
	border-image-width: 128px 512px !important;
	border-image-repeat: stretch !important;
	color: #000000 !important;
}

/* Nav bar background */
#mainNav, 
#mainNav.navbar-shrink {
	background-color: #302346F4;
}

/* Nav bar elements */
#mainNav.navbar-shrink .navbar-nav > li {
	margin-left: 10px;
	margin-right: 10px;
	display: flex;
	align-items: center;
}

/* Nav bar links */
#mainNav.navbar-shrink .navbar-nav > li > a,
#mainNav.navbar-shrink .navbar-nav > li > a:focus {
	color: #858585;
}
#mainNav.navbar-shrink .navbar-nav > li > a:hover,
#mainNav.navbar-shrink .navbar-nav > li > a:focus:hover {
	color: white; 
}
#mainNav.navbar-shrink .navbar-nav > li > a:active,
#mainNav.navbar-shrink .navbar-nav > li > a:focus:active {
	color: #858585; 
}

#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-purple,
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-purple:focus {
	color: #DD4DD8;
	font-weight: 800;
}
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-purple:hover,
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-purple:focus:hover {
	color: white;
}
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-purple:active,
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-purple:focus:active {
	color: #DD4DD8;
}

#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-blue,
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-blue:focus {
	color: #00c4f2;
	font-weight: 800;
}
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-blue:hover,
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-blue:focus:hover {
	color: white;
}
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-blue:active,
#mainNav.navbar-shrink .navbar-nav > li > a.nav-link-blue:focus:active {
	color: #00c4f2;
}



/* Nav bar Menu Button (on mobile screen) */
#mainNav .navbar-toggler {
	color: white;
}

/* Header (Company message and platform logos) */
header {
	text-align: center;
	background-image: url("../img/Masthead_GameslicePhoto_cmp.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position-y: 30%;
	background-position-x: center;
}

	/* Company message */
	#company-message {
		background-color: #4e4c7d88;
	}

		#company-message .container {
			display: flex;
			flex-direction: column;
			justify-content: center;
		}

		#company-message p {
			color: white;
		}

		#company-message h1 {
			font-size: 45x;
			font-weight: 1000;
			text-transform: uppercase;
			text-shadow: 4px 4px 5px #00000088;
		}

		@media (min-width: 768px) {  
			#company-message h1 {
				font-size: 60px;
			}
		}

		#company-message h1:nth-child(1) {
			color: #ee00f1;
		}
		#company-message h1:nth-child(2) {
			color: #00c4f2;
		}
		#company-message h1:nth-child(3) {
			color: white;
		}

	/* Platform logos */
	#platform-logos {
		background-color: #00c4f2DD;
	}

		#platform-logos img {
			height: 70px;
			margin: 30px 20px;
		}

/* Services */
.services-icons {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 50px;
}

	.services-icons > div {
		width: 200px;
	}

	.services-icons img {
		height: 100px;
		width: 150px;
		object-fit: contain;
	}

	.services-icons p {
		margin-top: 15px;
		margin-bottom: 30px;
		font-weight: 800;
		font-size: medium;
		text-transform: uppercase;
	}

/* Specializations */
	.specializations .row > div {
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.specializations-icon {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.specializations-icon img {
		max-width: 150px;
		max-height: 150px;
	}

	.specializations-desc {
		display: flex;
		flex-direction: column;
		align-items: left;
		justify-content: center;
	}

	.specializations-desc h2 {
		font-size: 1.2em;
		font-weight: 800;
		margin-bottom: 20px;
		text-align: left;
	}

	.specializations-desc p:last-child {
		margin-bottom: 0;
	}

/* Technology */
	#Technology .card {
		border-radius: 30px;
		box-shadow: 0px 0px 20px -10px;
	}

	#Technology .platform-images {
		text-align: center;
		margin-bottom: 30px;
	}

	#Technology .platform-images img {
		height: 100px;
		max-width: 150px;
		margin: 10px;
		object-fit: contain;
	}

	#Technology .code-icons {
		text-align: center;
	}

	#Technology .code-icons a {
		display: inline-block;
		color: black;
	}

	#Technology .code-icons a:hover {
		text-decoration: none;
	}
	
	#Technology .code-icons img {
		height: 70px;
		margin: 5px;
	}
	
	#Technology .code-icons img:hover {
		transform: scale(1.1);
	}

/* Partners + Clients */
	.client-images {
		text-align: center;	
		justify-content: center;
	}

	.client-images div {
		display: flex;
		justify-content: space-around;
		align-content: space-around;
	}

	.client-images a {
		align-self: center;
	}

	.client-images img {
		max-width: 200px;
		max-height: 200px;
		margin: 20px;
	}

	.client-images img:hover {
		transform: scale(1.1);
	}

/* Our Team */
.Team-Panel {
	background-image:url("../img/LondonBackground_cmp.png");
	background-color: #cccccc; /* Used if the image is unavailable */
	background-position: center; /* Center the image */
	background-repeat: no-repeat; /* Do not repeat the image */
	background-size: cover; /* Resize the background image to cover the entire container */
	background-position-y: 65%;
	color: white;
	position: relative;
	z-index: -2;
	padding-top: 100px;
	padding-bottom: 100px;
}

/* Game Slice */
#GameSlice {
	padding-top: 100px;
	padding-bottom: 100px;
}

	#GameSlice video {
		z-index: -2;
		top: 25%;
		left: 50%;
    	transform: translate(-50%, -25%);
	}

/* Game Highlight */
	.carousel-control-prev-icon {
		background-image: url("../img/carousel/Arrow.png");
		-webkit-transform: scaleX(-1);
  		transform: scaleX(-1);
		background-size: cover;
	}

	.carousel-control-next-icon {
		background-image: url("../img/carousel/Arrow.png");
		background-size: cover;
	}

	.carousel-indicators li {
		background-image: url("../img/carousel/Indicator.png");
		width: 30px;
		height: 30px;
		background-size: cover;
		background-color: transparent;
	}

	.carousel-indicators .active {
		background-image: url("../img/carousel/ActiveIndicator.png");
		width: 30px;
		height: 30px;
		background-size: cover;
		background-color: transparent;
	}

/* Contact Us */
.contact-us-form input, 
.contact-us-form textarea,
.contact-us-form select {
	background-color: #f4f4f4;
	border: 2px solid #BBBBBB !important;
}

.contact-us-form select {
	height: 41px;
	font-size: 10pt;
	border-radius: 10px;
}