@import url('https://fonts.googleapis.com/css?family=Oswald');

:root {
	--blue: #1E2D3B;
	--yellow: #EDCD1F;
	--gray: #F6F6F6;
	--dark-gray: #E0E0E0;
}
.bg-blue {
	background-color: #1E2D3B;
}
.w-50 {
	width: 50%;
}
/*--------------
--Navbar
--------------*/
.navbar {
	padding: 0;
}
.navbar .container {
	width: 100%;
	max-width: 100%;
	padding-right: 5%;
	padding-left: 0;
}
.navbar .dropdown-menu {
	background-color: #616c75;
}
.navbar .dropdown-menu ul {
	padding: 0;
	margin: 0;
}
.navbar .dropdown-menu li:hover {
	background-color: #1E2D3B;
}
.navbar .dropdown-menu li a {
	color: white;
	display: block;
}
.navbar-brand {
	padding: 10px 80px;
	background-color: var(--yellow);
}
.navbar-brand img {
	width: 150px;
	max-width: 100%;
}
@media only screen and (max-width:768px) {
	.navbar-nav {
		padding-left: 20px;
	}
}
@media only screen and (max-width:475px) {
	.navbar-brand {
		padding: 10px 30px;
	}
}
@media only screen and (max-width:375px) {
	.navbar-brand {
		padding: 10px 10px;
	}
}
/*----------------
--Header
----------------*/

.head {
	position: relative;
	padding: 0;
	overflow: hidden;
	height: 800px;
        background-color: #333;
}
.head-d {
	padding: 120px 0 50px 0;
	background-color: var(--blue);
	color: var(--light);
}
.h-title {
	position: relative;
	z-index: 5;
	top: 35%;
	bottom: 0;
	right: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 50%;
	text-align: center;
	color: var(--light);
	
}
	.h-title h1 {
		font-family: Oswald;
		letter-spacing: 10px;
	}
.btn-title {
	background-color: var(--blue);
	color: var(--light);
	padding: 1.1rem 1.2rem;
	font-size: 1.3rem;
	border-radius: 0;
	position: relative;
}
	.btn-title span {
		position: relative;
		z-index: 5;
	}
	.btn-title::before {
		content:  "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 100%;
		z-index: 0;
		background-color: #34424e;
		transition: all 0.3s ease-in-out;
	}
		.btn-title:hover {
			color: var(--light);
		}
		.btn-title:hover::before{
			right: 0%;
		}
		
.h-img {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 0;
}
	.h-img::before {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 2;
		background-color: var(--dark);
		opacity: 0.5;

	}
	.h-img img {
		position: relative;
		width: 100%;
		left: 50%;
		transform: translateX(-50%);
	}
@media only screen and (max-width:1500px) {
	.h-img img {
		width: 1500px;
	}
}
@media only screen and (max-width:1200px) {
	.h-img img {
		height: 800px;
		width: auto;
	}
}
@media only screen and (max-width:991px) {
	.h-title {
		width: 80%;
	}
        .navbar-brand {
	        padding: 10px 20px;
        }
        .head-d {
	        padding: 25px 0 50px 0;
        }
}

@media only screen and (max-width:768px) {
	.h-title {
		width: 100%;
		top: 15%;
	}
}

@media only screen and (max-width:576px) {
	.h-title {
		top: 15%;
	}
}


/*-----------------
--Section-1
------------------*/
.section-1 {
	background-color: var(--gray);
	border-bottom: var(--dark-gray) thin solid;
	padding: 10px;
}
.section-1 img {
	width: 150px;
	opacity: 0.7
}
.section-1 ul {
	margin: 0;
	padding: 0;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}

/*--------------
--Section-2
---------------*/

.section-2 {
	padding: 10px;
	background-color: var(--gray);
	border-top: var(--dark-gray) thin solid;
}
/*-------------
--Owl
-------------*/
.owl-img {
	height: 8rem;
}
.owl-body {
	height: 14rem;
}
/*-------------
--Footer
-------------*/

.foot {
	background-color: var(--blue);
	color: var(--light);
}
	.foot a {
		color: var(--light);
	}
		.foot a:hover {
			color: var(--light);
			opacity: 0.7;
		}
	.foot ul {
		list-style: none;
		
	}
		.foot li {
			padding: 10px 0;
			border-bottom: var(--light) thin solid;
		}
			.foot li a {
				display: block;
			}
.foot-b {
	background-color: black;
	padding: 15px;
	text-align: center;
}
.foot .fab {
       font-size: 30px;
}
.foot .library-image {
	margin: 0;
}