:root {
	--blue: #3089c5;
	--dark-blue: #162b38;
	--green: #00b19f;
	--brown: #7f452f;
}
.foot .library-image {
	 margin: 0;
}
.head .btn-blue {
	background-color: var(--blue);
	border-radius: 0;
	color: var(--light)!important;
	padding: 1rem 1.1rem;
	font-size: 1.2rem;
	border: var(--light) thin solid;
}
	.head .btn-blue:hover {
		background-color: var(--dark-blue);
		color: var(--light)!important;
	}
/*------------
--Header
--------------*/
.head {
	margin-top: 80px;
}
.col-top-3 {
	flex: 0 0 33.333%;
}
.col-mid-3 {
	flex: 0 0 33.333%;
	border-left: var(--light) 2px solid;
	border-right: var(--light) 2px solid;
}
.col-img {
	position: relative;
	overflow: hidden;
	height: 700px;
}
	.col-img img {
		position: relative;
		width: 600px;
		height: auto;
		left: 50%;
		transform: translateX(-50%);
	}
.col-info {
	position: relative;
	overflow: hidden;
	height: 700px;
	color: var(--light);
	background-color: var(--dark);
	text-align: center;
}

	.col-info img {
		max-width: 70%;
	}
.ci-container {
	margin-top: 15px;
	padding: 30px 0;
	border-top: var(--light) 2px solid;
	color: var(--green);
}
.ci-container a {
	margin: 15px 0;
	color: var(--green);
}
@media only screen and (max-width:992px) {
	.col-top-3 {
		flex: 0 0 25%;
	}
	.col-mid-3 {
		flex: 0 0 50%;
	}
}
@media only screen and (max-width:768px) {
	.col-top-3 {
		flex: 0 0 15%;
	}
	.col-mid-3 {
		flex: 0 0 70%;
	}
	
}
@media only screen and (max-width:576px) {
	.col-top-3 {
		flex: 0 0 5%;
	}
	.col-mid-3 {
		flex: 0 0 90%;
	}
}

/*--------- min-width ----------*/
@media only screen and (min-width:1600px) {
	.col-img img {
		width: 100%;
	}
	.col-img {
		height: 800px;
	}
	.col-info {
		height: 800px;
	}
}
@media only screen and (min-width:1800px) {
	.col-img img {
		width: 100%;
	}
	.col-img {
		height: 900px;
	}
	.col-info {
		height: 900px;
	}
}
@media only screen and (min-width:2100px) {
	.col-img {
		height: 1000px;
	}
	.col-info {
		height: 1000px;
	}
}
/*------------
--Head-d
-------------*/
.head-d {
	background: url('site/head-d.jpg');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
}
.head-d-item {
	position: relative;
	padding: 4rem 0;
}
	.head-d-item::before {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background-color: var(--dark);
		opacity: 0.6;
		z-index: 1;
	}
	.head-d-item h1 {
		color: var(--light);
		position: relative;
		z-index: 5;
	}
/*-------------
--Navbar
--------------*/
.navbar {
	padding: 0;
	border-bottom: var(--dark) 2px solid;
}
.navbar-brand img {
	width: 200px;
}

.nav-link {
	text-transform: uppercase;
	font-weight: 600;
        font-size: 14px;
}

.navbar .dropdown-menu ul {
	padding: 0;
	margin: 0;
}
@media only screen and (max-width:768px) {
	.navbar-nav {
		padding-left: 15px;
	}
}
/*----------------
--Section-1
----------------*/

.section-1 {
	background-color: var(--brown);
	color: var(--light);
	padding: 3rem 0;
	border-top: var(--dark) 2px solid;
}
.section-1 a {
	color: var(--light);
}
.section-1 h3 {
        font-size: 2.4rem;
}
/*--------------
--footer
--------------*/

.foot {
	padding: 3rem 0 0 0;
	background-color: var(--dark);
	color: var(--light);
}
	.foot a {
		color: var(--light);
	}
		.foot a:hover {
			opacity: 0.7;
		}
	.foot li {
		padding: 8px 0;
		border-bottom: var(--light) solid thin;
		list-style: none;
	}
	.foot li a {
		display: block;
	}

.foot-bottom {
	padding: 2rem 0;
	text-align: center;
	background-color: black;
}
