#nav{
	position: webkit-sticky;
	position: sticky;
	top: -1px;
	z-index: 100;
}
.brandImg{
	width: 2rem;
	vertical-align: middle;
	border-radius: 50%;
}

.section{
	text-align: center;
	padding-top: 50px;
	min-height: 50vh;
	padding-bottom: 20px;
}
.introSection{
	min-height: 100vh;
	background-image: url("../img/bac.jpg");
	background-size: cover;
	padding-top: 10vh;
}
.introSection *{
	font-family: 'Roboto Slab', serif;
	text-shadow: 0 0 8px rgb(0,0,0);
	color: #6AADB5;
	font-size: large;
}
.profileImage{
	width: 25%;
	border-radius: 50%;
	filter: drop-shadow(0 0 2rem #6AADB5);
	transition: 0.5s;
}
.profileImage:hover{
	filter: drop-shadow(0 0 1rem #6AADB5);	
}
.helloTxt, .helloIam {
	display: inline-flex;
	padding-top: 5vh;
	font-weight: bold;
	font-size: 10vh;
}
.helloIam, .practiceTxt{
	overflow: hidden; /* Ensures the content is not revealed until the animation */
	white-space: nowrap; /* Keeps the content on a single line */
	margin: 0 auto; /* Gives that scrolling effect as the typing happens */
	letter-spacing: .15em; /* Adjust as needed */
	width: 0;
	text-align: right;
	transition: 1s;
}

@media (max-width: 991px) {
	.introSection{
		padding-top: 20vh;
	}
	.profileImage{
		width: 50%;
	}
	.helloTxt, .helloIam{
		font-size: x-large;
	}
}

.sectionTitle{
	display: inline-block;
	font-size: 50px;
	font-weight: 100;
	padding: 10px 0;
	margin-bottom: 44px;
	text-align: center;
	border-bottom: solid 1px #ccc;
	border-top: solid 1px #ccc;
	text-transform: uppercase;
	line-height: 1.2;
}

.smallTitle{
	display: inline-block;
	font-size: x-large;
	font-weight: 300;
	padding: 10px 0;
	margin-top: 20px;
	margin-bottom: 44px;
	text-align: center;
	border-bottom: solid 1px #ccc;
	border-top: solid 1px #ccc;
	text-transform: uppercase;
	line-height: 1.2;
}

.aboutMeSection{
	background: rgb(255,255,255);
	background: linear-gradient(153deg, rgba(255,255,255,1) 0%, rgba(216,234,255,1) 35%, rgba(106,173,181,1) 100%);
	/*background-color: #6AADB5; /*#d8eaff;*/
	min-height: 50vh;
}
.bio p{
	text-align: left;
	font-size: small;
}
.interestIcon{
	font-size: xx-large;
	transition: 0.5;
}
.interestIcon p{
	font-size: small;
}

.skillsSection{

}
.practiceTxt{
	color: gray;
	font-family: cursive;
	font-size: xx-large;
	text-align: center;
}
@media (max-width: 991px) {
	.practiceTxt{
		font-size: large;
	}
}
.smallSkills{
	width: 50%;
}
.smallSkillsLangs{
	float: left;
}
.smallSkillsTools{
	float: right;
}
.smallSkills, .smallSkillSliderItem{
	text-align: left;
}
.smallSkills a, .smallSkillSliderItem a{
	color: black;
	text-decoration: underline;
}
.smallSkillSliderItem{
	padding: 20px 30px;
	margin: 0;
}

.workSection{
	background: rgb(255,255,255);
	background: linear-gradient(330deg, rgba(255,255,255,1) 0%, rgba(216,234,255,1) 35%, rgba(106,173,181,1) 100%);
}
.myWorkCategorieBtn{
	display: inline-block;
	font-size: large;
	font-weight: 300;
	padding: 10px 0;
	margin-top: 20px;
	margin-bottom: 44px;
	text-align: center;
	border-bottom: solid 1px #ccc;
	border-top: solid 1px #ccc;
	text-transform: uppercase;
	line-height: 1.2;
	padding: 0 20px;
	color: #7e7e7e;
	cursor: pointer;
	transition: 0.3s
}
.myWorkCategorieBtn:hover{
	border-bottom: solid 1px #7e7e7e;
	border-top: solid 1px #7e7e7e;
	color: black;
}
.myWorkCategorieBtn.activeMyWorkCategoriesBtn{
	border-left: solid 1px #7e7e7e;
	border-top: solid 1px #7e7e7e;
	border-right: solid 1px #7e7e7e;
	border-bottom: none;
	color: black;
}
.projectCard{
	background-color: black;
	padding: 60px 0;
	margin: 10px 0;
	border: solid gray 1px;
	transition: 0.3s;
	overflow:hidden;
	position: relative;
	text-align: center;
}
.projectCard p{
	width: fit-content;
	color: white;
	font-weight: bold;
	transition: 0.3s;
	text-shadow: 0 0 5px #6AADB5;
	background-color: rgba(0,0,0,0.3);
	margin: auto;
    padding: 5px 10px;
    border-radius: 10px;
}
.projectCaption {
	width:100%;
	height:0%;
	background:rgba(0, 0, 0, 0.7);
	position:absolute;
	transition: 0.5s;
	opacity:1;
	overflow: hidden;
	bottom: 0px;
}
.projectCaption p{
	padding: 5px;
	font-size: small;
	position: absolute;
	background-color: unset;
}
.projectCaption h5{
	color: white;
	font-weight: bold;
	padding-top: 15px;
}
.projectCard:hover .projectCaption{
	opacity: 1;
	height: 100%;
}

.jobWrap{
	padding-bottom: 5px;
}
.job{
	background-color: white;
	padding: 20px 5px;
	border: solid 1px lightgray;
	margin: 5px;
}
.jobIcon, .jobIcon a{
	color: #6AADB5;
}
.jobDet{
	text-align: left;
	margin-left: 20px;
}
.jobDetBtn{
	margin-top: 1rem;
}
.job p{
	padding: 0;
	margin-bottom: 2px;
}


.contactSection{

}
.contactSection form{
	text-align: left;
}
.contactSection .row{
	padding-top: 15px;
}
.socialIcon{
	transition: 0.2s
}
.socialIcon:hover{
	transform: scale(0.9);
	border-radius: 20%;
}
.mi:hover{	
	filter: drop-shadow(0 0 1rem blue);
}
.gh:hover{	
	filter: drop-shadow(0 0 1rem black);
}
.in:hover{	
	filter: drop-shadow(0 0 1rem darkblue);
}
.ig:hover{	
	filter: drop-shadow(0 0 1rem orange);
}

.footer{
	min-height: 20vh;
	background-color: #222222;
}