/* custom css */
html{
    scroll-behavior: smooth;
}
#overlay{
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
  background: #fff1f1;
}

.top_menu{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 99;
	display: block;
  	transition: top 0.6s;
  	background: #fff;
    /*box-shadow: 0px 0px 16px 0px #00000024;*/
}

.cover_content{
	margin-top: 100px;
	position: relative;
	margin-bottom: 30px;
 
}
.button_link.active a{
	color: #E6A210;
}
.hero_title{
	font-family: Merriweather;font-family: "Lato", sans-serif;
	font-size: 106.51px; 
	position: relative;padding-left: 65px;
}
.hero_designer{
	transition: all .3s;
	position: relative;
}
.hero_designer span{ display: inline-block; }
.horo_dot:before{
	content: "";
	width: 33.63px;
	height: 33.63px; 
	background: #0D0D0D;
	position: absolute;top:50px;left: 20px; border-radius: 30px;
}
.rotating_txt{height: 150px;overflow: hidden;}
.rotating_txt .hero_text{
	display: block;
	transform:translateY(120px);
	position: absolute;
	transition: all .2s;
}
.rotating_txt .hero_text.active{
	transform:translateY(0px);
}


.navbar-toggler{ transition: all .5s; }
.top_menu .navbar-collapse{
	transition: all .6s;
}




.cover_images{
	background-image: url('../images/leena_cover.jpg');
	/*background-attachment: fixed;*/
	width: 100%;
	height: 60vh;
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat; 
	transition: all .3s ease-out;  
	 /*transition: background-image 1s ease-in-out;*/
}
.cover_images:hover{
	transform: scale(1.05);
}

.about_section{ padding: 50px 0px; }
.about_section p{ 
	font-size: 24px;
	font-weight: 600;  
}
.about_section p span{
	color: #E6A210;

}
.about_quote{
	font-size: 77.94px;
	color: #0D0D0D; text-align: center;
}
.about_quote span{ color: #E6A210;font-style: italic; }


.about_section .about_link {
  background: #0D0D0D;
  width: 200px;
  height: 200px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border-width:10px;
  border-color:red;
  cursor: pointer;
  text-decoration: none;
  transition: all 300ms;
  box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
}

.about_section .about_link > span {
  font-size: 24px;
  color: #fff;
  transition: transform 300ms ease-out;
}
.about_section .about_link:hover{
	background: #E6A210;
}
.about_section .about_link:hover span{ color: #fff; }

.work_section{
	padding: 50px 0px;
}
.work_title{
	color: #A6A6A6;
	font-size: 232.42px;
	text-align: center;font-family: "Lato", sans-serif;
}
.work_card{
	background-color: #D9D9D9;
	border-radius: 20px;
	height: 200px;
	margin-bottom: 30px;
	background-size: cover;background-repeat: no-repeat;
	background-position: center; border:1px solid #a6a6a6;
}

/* About page css ------ start */
.section_title {position: relative;display: flex;align-items: center; margin: 30px 0px;font-size: 24px;}
.section_title:after {
    content: '';
    flex: 1 1;
    margin-left: 0.7rem;
    height: 1px;
    background-color: rgba(201, 201, 201, 1);
}
.astring{position: relative;}
.sec_title{
	position: absolute;
    left: 0px;
    bottom: 18px;
    background: #fff;
    padding: 9px 10px;
    font-size: 24px;
}
.about_me{ padding-top: 100px; }
.about_me .content .name{ font-size: 40px; }
.about_me .content .position{ font-size: 30px; color:#E6A210;font-family: "Lato", sans-serif; }
.about_me .content p{ font-size: 18px; font-family: "Lato", sans-serif;}


.skills_section{
	padding: 40px 0px;
}
/*#info_tab */
.nav-pills .nav-link{ color: #0D0D0D !important; font-size: 20	px;}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{ 
	background-color:#fff; border-radius:0px;color: #E6A210 !important;border-bottom:3px solid #E6A210;

}


#pills-hobbies img{
	width: 100%;
}
.language{ text-align: center; }
.language .circle{
	border: 3px solid #262626;
	border-radius: 50%;
	width: 110px; height: 110px;
	    display: flex;
    align-items: center;
    justify-content: center;     margin: auto;
}
.language .circle .filled{
	background: #E6A210;
	border-radius: 50%;
	width: 90px; height: 90px;
	transition: all 1s;
}
.lang_title{ font-size: 17px;margin: 20px 0px; }
.language .circle .filled.half{ width: 50px;height: 50px; }


.education{text-align: center;margin-bottom: 25px;}
.education img{ margin-bottom: 10px; }
.education p{ margin-bottom: 10px;font-size: 16px !important; }
.education .course{ font-weight: bold; }
.education .duration{ color: #A6A6A6;font-size: 14px; }



	.skill{
		display: flex;
	    align-items: center;
	    justify-content: space-between;
	    margin: 20px 0px;
	}
	.skill img{ width: 50px;margin-right: 20px; }
	.skill .progress{ width: 100%; }
	.skill .progress .progress-bar{background-color: #E6A210;}


	.spec_program{ text-align: center;margin-bottom: 40px; }
	.spec_program p{ margin:20px 0px; }



	.experience_section{
		padding: 40px 0px;
		overflow: hidden; position: relative;
	}
	.exp_row { position: relative; }
	.exp_logo{ display: flex;align-items: center;justify-content: center;height: 100%; }
	.exp_logo img{ margin-top:30px; margin-bottom: 15px;    max-width: 200px; }
	.exp_content{ position: relative;font-family: "Lato", sans-serif;margin-bottom: 50px;padding-left: 40px; margin-left: 20px; }

	.exp_content .designation{ font-size: 18px; font-weight: bold;margin-bottom: 15px; 
		display: flex;align-items: center;justify-content: space-between;
	} 
	.exp_content .designation .duration{ font-weight: normal; }
	.exp_content .work_details {
		list-style-image: url('../images/bullet_plus.svg');
		padding-left: 22px;
		font-size: 14px;
	}
	.exp_content .work_details li{ margin-bottom: 10px; }


	.exp_content .designation:before{
		content: '';
		width: 40px; height: 40px;
		background-color: #0D0D0D; border-radius: 30px;
		position: absolute;left: -30px;
		border: 10px solid #fff;
	}
	.exp_content:before{
		content: '';
		width: 3px; 
		/*height: 130%;*/
		height: 10px;
		background-color: #A6A6A6; 
		position: absolute;left: -11px; 
		  transition: height 2s;

	}
	.exp_content.animate:before{ height: 550px; }

	.primary_button{
		padding: 15px 40px;
		border-radius: 30px;
		background-color: #0D0D0D;
		color: #fff;
		text-decoration: none;
		transition: all .4s;
		    position: relative;
		display: block;
		max-width: 248px;
		margin: auto; 
		box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
	}
	.primary_button:hover{
		background-color: #E6A210; transform: translateY(-10px);
	}

 


	.exp_years{
		font-size: 150px; color: #A6A6A6;
		position: absolute;
		top: 40%;
		right: 0px;position: 
	}
	.exp_years span{ font-size: 40px;position: absolute;    right: 19px; bottom: 16px; }
	
	.my_work{ padding: 80px 0px; }
	.my_work_tabs{ justify-content: space-around; }
	.work_card{
	    min-height: 300px;
	    width: 100%;
	    overflow: hidden;
	    border-radius: 20px;
	    position: relative;
	}
	.work_card img{
      transition: transform .25s, visibility .25s ease-in;
      width: 100%;
      height: 100%;
	}
	.work_card .overlay{ 
		position: absolute; left: 0px;z-index: 9;bottom: 0px;width: 100%;height: 100%; 
		/*background-image: linear-gradient(red, yellow, blue);*/
		background-image: linear-gradient(to top, #000000b5 0%, #ffffff00 100%);
		    background: linear-gradient(0deg, rgb(22, 22, 22) 0%, rgba(22, 22, 22, 0.27) 40%, rgba(22, 22, 22, 0) 100%);
	}
	.work_card .overlay .txt{
		position: absolute;  bottom: 0px; left: 0px; padding: 2px 15px; color: #fff;
	}
	.work_card .overlay h5{ font-size: 18px;font-weight: bold;font-family: "Lato", sans-serif; }
	.work_card .overlay p{ font-size: 14px; }
	.work_card:hover img { transform: scale(1.1);  }
/* About page css ------ end */

.contact_me{ padding: 80px 0px; }
.contact_form{
	position: absolute;right: 0px;top: 20px; max-width: 50%;
}
.contact_form .form-control{ background-color: #D9D9D9; border-radius: 8px;transition: all 0.5s;  }
.contact_form .form-control:focus{
	box-shadow: unset;
	border: unset;
	background-color: #e6a21075;
}

.footer{
	background: #262626;
	color: #fff;
	padding-top: 50px;
	padding-bottom: 150px;
	font-family: Lato;
	position: relative;    overflow: hidden;
}
.footer .thanks{ 
	height: 150;
    font-size: 30px;
    line-height: 36px;
    color: #fff;
    padding: 30px 0px;
    position: relative;
    overflow: hidden;
}
.footer .thanks .arrow_right{
	width: 25px; 
	transition: all .4s;
	transform: translateY(70px);
}
.footer .thanks:hover .arrow_right{
	transform: translateY(0px);
}
.footer .thanks a{ color: #fff;text-decoration: none; }
.footer_menu .f_menu_title{ color: #A6A6A6;font-size: 18px;margin-left: 30px; }
.footer_menu .f_menu{
	display: flex;
	align-items: center;justify-content: start;
	padding-left: 0px; flex-wrap: wrap;
}
.footer_menu .f_menu .button_link a{ color: #fff; }
.footer_menu .f_menu .button_link{ width: 50%;  }
.footer_menu .f_menu .button_link .label-up{ text-align: left; }

.footer_big_txt{ 
    font-size: 200px;
    transform: translateY(50px);
    color: #000; 
    /*transform: translateY(180px);*/
    position: absolute;
    width: 100%;
    left: 0px;
     bottom: 0px; 
    line-height: 181px;text-align: center;
}
.line{
	width: 100%;border: 1px solid #fff;
}

@media(max-width: 991px){
	.navbar-toggler{ border: 0px; }
	.navbar-toggler:focus{ box-shadow: none; }
	.navbar-toggler .navbar-toggler-icon {background-image: url('../images/x.svg');}
	.navbar-toggler.collapsed .navbar-toggler-icon {background-image: url('../images/menu.svg');}

	.top_menu .navbar-collapse{ 
		        background-color: rgb(0 0 0 / 56%);
        backdrop-filter: blur(10px);
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
        /* height: 80vh; */
        border-radius: 40px;
        margin-top: 15%;
        position: fixed; 
                width: 88%;
        margin: auto; 
		  top: 50%;
		  left: 50%;
		  transform: translate(-50%, -50%);
	}
	.navbar-nav .button_link{
		height: 100px; 
	}
	.navbar-nav .button_link a{ color: #fff; }
	.social_links{    bottom: -80px; }
	.about_section .about_link{
		height: 140px; width: 140px; float: right;
	}
	.about_quote{ font-size: 40px; }
	.contact_me .cover_content{
		margin-top: 60px;
	}
	.contact_me .social_links{ bottom: 30px;justify-content: flex-end !important;   }

	.contact_form{ position: relative;  }

	.work_title{ font-size: 100px; }
	.xlHeader { overflow: unset;padding: 30px 0px; }
	.xlHeader--right .xlHeader__header{ position: unset;transform:unset; }
}

@media(max-width: 767px){
	.hero_title{ font-size: 50px; }
	.rotating_txt{ height: 70px; }
	.horo_dot:before{ width: 20px;height: 20px; top: 25px; }
	.social_links li a{ width: 60px; height: 60px;line-height: 60px;font-size: 26px; }

	.work_title{ font-size: 60px; }
	.exp_years{ font-size: 116px;top: 5% } 
	.exp_years span{ font-size: 30px; }

	.footer_big_txt{ font-size:100px;transform: translateY(65px); }

}

@media (max-width: 440px) {
	.about_section p{ font-size: 17px; }
	.exp_years{ font-size: 75px;top: 5% } 
	.exp_years span{ font-size: 20px; }
	.my_work_tabs, #info_tab {
		flex-wrap: nowrap;
    	overflow: scroll;
	}
	.nav-pills .nav-link{
		    width: 154px;        margin-bottom: 10px;
	}
	/*.work_card{ min-height: unset;    height: 130px; }*/
	.work_card{ width: 90%;margin-left: auto;margin-right: auto; }
	.footer{ padding-bottom: 50px; }
    .footer_big_txt {
        font-size: 100px;
        transform: translateY(14px);
        line-height: 61px;
        font-size: 57px;
    }
    .footer .thanks{
    	font-size: 23px;
        padding-top: 0px;
        padding-left: 29px;
    }
	.contact_form{ max-width: 100%;  }

}