html {
	font-family: "Open Sans" sans-serif;
}
li {
	list-style: none !important;
	margin-right: .2rem;
	font-size: 16px;
	font-weight: 500;
}
img {
	width: 100%;
}
.navbar-grey {
	background: #999999;
	padding: 20px !important;
}
.bg-sticky {
	position: fixed !important;
	width: 100%;
	z-index: 999;
}
.img-fluide {
	height: auto;
	width: 40px;
}
.align-center {
	align-items: center;
}
.nav-item {
	padding: 10px;
	position: relative;
	font-weight: bold;
}
.nav-item:hover{
	background: #77d8ed;
	color: white;
}
.nav-item a:hover{
	color: white;

}
.active{
    background-color: #2799b1 !important;
	font-weight: bold;
	color: white;
}

.sub-menu {
	padding: 0;
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: white;
	width: 100%;
	font-size: 16px;
	text-transform: uppercase;
}
.nav-item:hover .sub-menu {
	display: block !important;
}
.sub-menu li {
	padding: 10px;
	width: 100%;
}
.sub-menu li:hover {
	background: #e6e6e6;
}
.cc-active{
	background-color: #e6e6e6;
}
.sub-menu li a {
	text-decoration: none;
	color: black !important;
	display: block;
}
li.dropdown_onclick{
	display: none !important;
}
.hamburger{display: none;}
@media screen and (max-width: 788px){
	.hamburger {
		display: block;
		position: absolute;
		right: 0;
		z-index: 999;
		padding: 3rem;
		font-size: 24px;
		color: white;
	}
	.closeIcon {
	  display: none;
	  
	}
	.menu {
		margin: 0 !important;
		padding: 4rem 0!important;
	  position: fixed;
	  transform: translateX(-100%);
	  transition: transform 0.2s;
	  top: 0%;
	  left: 0;
	  bottom: 0;
	  z-index: 99;
	  background: black;
	  color: white;
	  list-style: none;
	  width: 50%;
	  display: flex;
	  flex-direction: column;
	}
	.showMenu {
	  transform: translateY(0);
	}
	.nav-item .sub-menu {
		display: block;
		position: initial;
		z-index: 999;
	}
	.nav-item.d-flex{
		flex-direction: column;
	}
	li.dropdown_onclick{
		display: block !important;
	}
	li.dropdown_onclick .sub-menu-list{
		display: none !important;
		padding: 0;
		text-align: center;
	}
	li.dropdown_onclick.active .sub-menu-list{
		display: block !important;
	}
	li.dropdown_hover {
		display: none !important;
	}
	li.dropdown_onclick .sub-menu-list li {
		margin-top: 1rem;
		text-decoration: none;
	}
	li.dropdown_onclick .sub-menu-list li a {
		text-decoration: none;
		color: white;
	}
	li.dropdown_onclick .sub-menu-list li a:hover {
		color: #a1a1a1;
	}
	.active {
		background: transparent !important;
	}
	.nav-item:hover {
		background: transparent !important;
	}
	.menu{
		align-items: center;
	}
	.menuItem:hover {
		color: #a1a1a1 !important;
	}
}


.hero-img {
	/* min-height: 80vh; */
	background-image: url("../images/jh.jpg");
	background-position: 50% 50%;
}

.fs-24 {
	font-size: 24px !important;
}
.font-text {
	font-family: 'Raleway', sans-serif;
	font-weight: bolder;
	font-size: 40px;
	letter-spacing: 1px;
	margin-bottom: 10px;
	margin-top: 4rem;
}
 .font-weight {
	font-weight: bolder;
	padding: 1rem 0;
	font-style: italic;
	font-family: "Open Sans";
	margin-top: 1rem;
}

.hero-text .font-weight{
	font-style: initial;
}
.font-weight p {
	font-size: 18px;
}

.btn {
	padding: 15px 44px 17px !important;
	background-color: #d5e76c !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	font-size: 16px !important;
}
.btn a {
	color: #2799b1 !important;
}
.btn:hover{
	color: #2799b1 !important;
	background-color: #cde24f !important;
}
.d-grid {
	display: grid;
}
.place-center {
	place-items: center;
}
.heading {
	min-height: 80vh;
	color: white;
}
.hero-text {
	background: #e5e5e5;
}
.w-60 {
	width: 60%;
	margin:  0 auto;
}
.hero-text .font-text{
	font-size: 32px;
	font-weight: 500;
}
.hero-text .font-weight{
	font-weight: initial;
}


.bg-color {
	background-color: #999999;
	padding: 3rem 0;
}
footer a {
	text-decoration: none;
	color: white;
	font-size: 18px;
	font-weight: 400;
}
footer p {
	color: white;
	font-size: 18px;
}
.footer-items a{
	margin-bottom: 2px;
	border-bottom: 2px solid #2799b1;
}
.footer-items:hover a{
	border-bottom: none;
}
.footer-items:hover a{
	color: white;
}
.projects-items a{
	color: #2799b1;
}
.projects-items a:hover {
	color: white;
}
footer span{
	color: white;
}
footer .text-center span a {
	color: #2799b1;
}
footer .text-center span a:hover{
	color: #23889c;
}
footer .d-flex span a{
	color: #afe9f5;
}
footer .d-flex span a:hover{
	color: #a2c6ce;
}
/* about section  */
.text-about {
	background-color: #b3b3b3 !important;
	padding: 70px 100px 20px !important;
}
.text-about h1 {
	margin-top: 40px !important;
	font-size: 24px !important;
	color: white;
	font-weight: bolder;
	
}
.about {
	color: black !important ;
	padding: 80px !important;
	margin: 0 80px !important;
}
.btn-color{
	background-color: #2799b1 !important;
	color: white !important;
}
.btn-color:hover {
	background-color: #23889c !important;
	color: white !important;
}

/* about end here  */

/* connect-coder start here  */
.bg-img {
	background-image: url("../images/cc-on-top.jpg");
	background-position: 50% 50%;
	height: 100px;
	background-repeat: no-repeat;
	background-size: cover;
}
.u-grey-60 {
	background-color: #666666;
}
.u-text-default {
	padding: 2rem 0;
	color:white;
}
.u-white {
	text-align: center;
	background-color: white;
	padding: 30px;
	border-radius: 20px;
	flex: 1;
}
.u-icon-circle {
	border-radius: 50%;
	background-color: #d5e76c;
	height: 94px;
	width: 94px;
	margin: 0 auto;
	padding: 25px;
}
.u-file-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.col-1 {
	width: 32% !important;
	margin: 20px 0;
}
.u-text-4{
	text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 20px;
	color: #2799b1;
    margin: 23px 0 0;
}
.u-text-4 a {
	text-decoration: none;
	display: block;
}
@media screen and (max-width: 768px) {
	.col-1 {
		width: 48% !important;
	}
	.w-60{
		width: 100%;
	}
	.text-about{
		padding-left: 10px !important;
		padding-right: 0 !important;
		
	}
	.text-about h1{
		font-size: 18px !important;
	}
}
@media screen and (max-width: 425px) {
	.col-1 {
		width: 100% !important;
	}
}
.text-right {
	text-align: right;
}
.u-text {
	color: white;
	font-weight: 400;
	font-size: 18px;
	margin: 0;
}
.u-text-9 {
	padding-bottom: 3rem;
}
.u-border-white{
	text-decoration: none;
	color: white;
	font-weight: 500;
	border-bottom: 2px solid white;;
}

.grid-container {
	display: flex;
	padding: 2rem;
}
.grid-item {
	text-align: center;
	padding: 30px;
	width: 100%;
}

.u-text-1 {
	font-size: 48px;
	font-weight: 500;
	color: #111111;
}
.u-text-2{
	font-size: 16px;
	margin: 22px 0 0;
	color: #111111;
}
.bg-cover-img {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJkZWZhdWx0LWltYWdlLXNvbGlkIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgNDAwIDI2NSIgc3R5bGU9IndpZHRoOiA0MDBweDsgaGVpZ2h0OiAyNjVweDsiPg0KPHJlY3QgZmlsbD0iI0M2RDhFMSIgd2lkdGg9IjQwMCIgaGVpZ2h0PSIyNjUiLz4NCjxwYXRoIGZpbGw9IiNEOUUzRTgiIGQ9Ik0zOTUuMyw5Ni4yYy01LTAuOC02LjEsMS4xLTguNSwyLjljLTEtMi4zLTIuNi02LjItNy43LTVjMS41LTUuMy0yLjYtOC40LTcuNy04LjRjLTAuNiwwLTEuMiwwLjEtMS44LDAuMg0KCWMtMS44LTQuMS02LTYuOS0xMC43LTYuOWMtNi41LDAtMTEuOCw1LjMtMTEuOCwxMS44YzAsMC40LDAsMC45LDAuMSwxLjNjLTEuMi0wLjgtMi41LTEuMy0zLjktMS4zYy00LjMsMC03LjksNC4yLTcuOSw5LjQNCgljMCwxLjIsMC4yLDIuNCwwLjYsMy41Yy0wLjUtMC4xLTEtMC4xLTEuNi0wLjFjLTYuOSwwLTEyLjUsNS41LTEyLjcsMTIuNGMtMC45LTAuMi0xLjktMC40LTIuOS0wLjRjLTYuNCwwLTExLjcsNS4yLTEyLjUsMTEuOA0KCWMtMS4yLTAuNC0yLjUtMC42LTMuOS0wLjZjLTUuOSwwLTEwLjgsMy44LTEyLjEsOC45Yy0yLjQtMi01LjUtMy4yLTguOS0zLjJjLTYsMC0xMS4xLDMuNy0xMi44LDguOGMtMS41LTEuNC0zLjgtMi4zLTYuMy0yLjMNCgljLTIuMSwwLTQuMSwwLjYtNS41LDEuN2gtMC4xYy0xLjMtNS41LTYuMi05LjUtMTIuMS05LjVjLTIuNCwwLTQuNywwLjctNi42LDEuOWMtMS40LTAuNy0zLTEuMi00LjgtMS4yYy0wLjMsMC0wLjUsMC0wLjgsMA0KCWMtMS41LTQuMS01LjItNy05LjUtN2MtMy4xLDAtNS45LDEuNS03LjgsMy45Yy0yLjItNC44LTYuOC04LjItMTIuMi04LjJjLTUuNiwwLTEwLjUsMy43LTEyLjUsOC44Yy0yLjEtMC45LTQuNC0xLjUtNi45LTEuNQ0KCWMtNi44LDAtMTIuNSwzLjktMTQuNSw5LjNjLTAuMiwwLTAuNSwwLTAuNywwYy01LjIsMC05LjYsMy4yLTExLjQsNy44Yy0yLjctMi44LTctNC41LTExLjgtNC41Yy0zLjMsMC02LjQsMC45LTguOSwyLjMNCgljLTIuMS02LjUtOC0xMi4yLTE4LjEtOS45Yy0yLjctMi4zLTYuMy0zLjctMTAuMS0zLjdjLTIuNSwwLTQuOCwwLjYtNi45LDEuNmMtMi4yLTUuOS03LjktMTAuMS0xNC42LTEwLjFjLTguNiwwLTE1LjYsNy0xNS42LDE1LjYNCgljMCwwLjksMC4xLDEuNywwLjIsMi41Yy0yLjYtNS03LjgtOC40LTEzLjgtOC40Yy04LjMsMC0xNS4xLDYuNS0xNS42LDE0LjZjLTIuOS0zLjItNy01LjMtMTEuNy01LjNjLTcuNCwwLTEzLjUsNS4xLTE1LjIsMTINCgljLTIuOS0zLjUtOS44LTYtMTQuNy02djExOS4yaDQwMFYxMDJDNDAwLDEwMiw0MDAsOTcsMzk1LjMsOTYuMnoiLz4NCjxwYXRoIGZpbGw9IiM4RUE4QkIiIGQ9Ik00MDAsMjA2LjJjMCwwLTI1LjMtMTkuMi0zMy42LTI1LjdjLTEzLjQtMTAuNi0yMy4xLTEyLjktMzEuNy03cy0yMy45LDE5LjctMjMuOSwxOS43cy01OC45LTYzLjktNjEuNS02Ni40DQoJYy0xLjUtMS40LTMuNi0xLjctNS41LTAuOWMtNS4yLDIuNC0xNy42LDkuNy0yNC41LDEyLjdjLTYuOSwyLjktNDEtNTAuNy00OS42LTUzcy04NC4zLDgzLjMtMTAxLjQsNzUuMXMtMjYuOS0yLjMtMzUuNCwzLjUNCgljLTguNiw1LjktMTEsNS45LTE1LjksOC4ycy0xNy4xLTUuOS0xNy4xLTUuOVYyNjVjMCwwLDQwMCwwLjIsNDAwLDB2LTU4LjhINDAweiIvPg0KPHBhdGggZmlsbD0iIzdFOTZBNiIgZD0iTTMzMy40LDE3OWMtMTMuMS05LjMtNDAsNC42LTU1LjEsMTAuN2MtMjMuNiw5LjYtOTQtNTQuNC0xMDcuMi01OS43YzAsMC00LjIsMy43LTkuNiw3LjYNCgljLTMuNS0wLjQtOC40LTUuNy05LjktNC43Yy00LjYsMy4xLTE3LjgsMTUuNC0yOC4zLDI2LjZjLTEwLjUsMTEuMy0xMS43LDAtMTUuOC0wLjZjLTIuNS0wLjQtNTQuMSw0Mi41LTU4LjcsNDMuMQ0KCUMyMi4zLDIwNS4zLDAsMTk3LjUsMCwxOTcuNVYyNjVsNDAwLTAuMXYtNTMuM0M0MDAsMjExLjYsMzQ0LjgsMTg3LjEsMzMzLjQsMTc5eiIvPg0KPHBhdGggZmlsbD0iIzc4OEY5RSIgZD0iTTAsMjY0Ljl2LTU4LjZjMCwwLDguMiwxLjgsMTEuMyw1LjNjMy4xLDMuNiwyNi4xLTQuMiwyNi4xLDQuN3MwLjUsNC4yLDAuNSwxNC44YzAsMTAuNywyMy00LjIsMzguMS0xOC40DQoJczM0LjktNDkuMiwzNi0zNWMxLDE0LjItMTUuMSwzOS4yLTI0LDU2LjRDNzkuMSwyNTEuNCw1MS43LDI2NSw1MS43LDI2NUwwLDI2NC45eiIvPg0KPHBhdGggZmlsbD0iIzc4OEY5RSIgZD0iTTEwMCwyNjVjMCwwLDY2LjctMTI1LjEsNjguMy0xMTYuOHMtNi44LDI5LjcsMi4xLDI2LjFjOC45LTMuNiwxNC42LTE2LDE4LjgtOS41czE2LjIsMzguNiwyMS45LDMzLjgNCgljNS43LTQuNywyMS40LTEzLjEsMjIuNC02LjVjMSw2LjUtMSw1LjMtNS43LDIwLjJDMjIzLjEsMjI3LjEsMjAwLDI2NSwyMDAsMjY1aC0xMGMwLDAsNi0yNC44LDguNi0zNC45YzIuNi0xMC4xLTMuNy0xOS0xMi04LjMNCglzLTIzLDIyLTI0LDE3LjhzLTUuNy0zMC4zLTE4LjgtMTQuMmMtMTMsMTYtMzMuOCwzOS43LTMzLjgsMzkuN2gtMTBWMjY1eiIvPg0KPHBhdGggZmlsbD0iIzc4OEY5RSIgZD0iTTI0NSwyNjVjMCwwLDE5LjgtNTQuNywzMy40LTY0LjJzNTMuNy0yNy45LDQ2LjktMTMuNmMtNi44LDE0LjItMTEsMzQuNC0yMC4zLDQ5LjgNCgljLTkuNCwxNS40LTE4LjgsMjYuMS0xNC4xLDEzLjZjNC43LTEyLjUsNi40LTIzLjMsMy43LTIzLjFDMjcxLjMsMjI5LjEsMjYwLDI2NSwyNjAsMjY1SDI0NXoiLz4NCjwvc3ZnPg0K");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
	width: 100%;
	display: grid;
	place-items: center;
}
.u-text-3 {
	font-weight: bolder;
	text-align: center;
}

.bg-eee{
	background-color: #eee;
}
.u-text-interest {
	font-size: 36px;
	padding: 5rem 0;
	text-align: center;
}
.u-text-interest a {
	color: #23889c;
	text-decoration: none;
}
.u-text-interest a:hover{
	color: #2799b1;
}
@media screen and (max-width: 768px){
	.grid-container{
		flex-direction: column-reverse;
	}
	
	.bg-cover-img {
		height: 100vh;
	}
	.u-text-4{
		font-size: 16px;
	}
	.u-text-1{
		font-size: 36px;
	}
}
@media screen and (max-width: 768px){
	.u-text-interest{
		font-size: 22px;
	}
	.fs-48{
		font-size: 35px !important;
	}
}


/* for project and programming languages  */

.bg-333 {
	background-color: #333;
}
.u-group-1 {
	background-image: linear-gradient(to right, #2799b1, #d5e76c);
	min-height: 471px;
	margin: 1px auto 0 0;
}
.u-text-body-alt-color{
	color: white !important;
}

.fs-48 {
	font-size: 48px;
}
.fs-30 {
	font-size: 30px;
}
.fs-20 {
	font-size: 20px;
}
.fs-16 {
	font-size: 16px;
}
.ls-1 {
	letter-spacing: 1px;
}
.text-left {
	text-align: left;
}
.col-l-6 {
	width: 49% !important;
}
@media screen and (max-width: 768px){
	.col-l-6{
		width: 100% !important;
		margin-top: 10px !important;
	}
}


.bg-fbfdef{
	background-color: #fbfdef;
	color: #111111;
}