@charset "UTF-8";


html body{
	font-family: 'Open Sans', sans-serif;
	margin: auto 0;
	scroll-behavior: smooth;
}
a{
	
	text-decoration: none;}
a:hover{

	text-decoration: none;
}
/*-------------------------------------------*/
.ICN-SZ{
	width:15px;
	height: 25px;
	
}
.navbar-nav{
		text-align:right;	
}

#logo{
	padding: 10px;
}

.NAV{
	font-size: 20px;
	font-weight: 700;
	width:20%;
	margin-right: 50px; 
	color: black !important;
}

.NAV li{
	padding-right: 15px;
}

.BBG{
	background-image: url("images/BG4.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	
	width: 100%;
	height: 100vh;
	
}
/*-----------------HOMECOVER----------------------*/

#INTRO{
	
	height: 100%;
	width: 100%;
}
.INT-BG{
	width: 100%;
height: 10%;

	
}

.TTLE{
	font-weight: 600;
	font-size: 55px;
	text-align: center;
	opacity: 1;
	color: black;
	width: 100%;
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

span{
	color: rgba(76,233,32,1.00);
}


/*-------------------------------------about---------------------------------*/


#MY-pro{
float: center;
	transform: translateX(0%);
width:600px;
	opacity: 0;
  animation-name: fadeIn;
  animation-duration: 8s;
  animation-fill-mode: forwards;
}

@keyframes fadeIn{
	
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }	
	
}

.Infu{
	color: black;
	font-weight: 400;
}




.ABT_TXT h1{
	font-size:40px;
	transform: translate(2%,50%);
	color: black;
}



/*--------------Work--------------------------------------------------------*/



.ROW_IMG{
	margin-left:10px;
}





.WK_SEC h1{

	
}

.container{
	width: 1500px;
}
/*----------WORK IMG________________--*/
.info{
	color:black;
	text-align:left;
}
.Title{
	color: black;
	font-size: 20px;
}
.year{
	color:#474747;
}





.IMG-HOVER{
	opacity: 0;
	
}


.IMG-HOVER:hover{
	opacity: .9;
	transition: .6s all ease;
	transform: scale(1.5);
}.INT-Ro {
}

.lb-close {
    color: #fff;
  }

  .lb-prev, .lb-next {
    color: #fff;
    font-size: 2rem;
  }


.RCol{
margin-bottom:10px;
}


#FOOTY{
	color:#4CE920;
}

#FOOTY:hover{
	color: #4CE920;
}


.skillbar {
  width: 100%;
	border-radius: 25px;
  background-color: #f2f2f2;
  height: 35px;

}

.skillbar-progress {
		border-radius: 25px;
  background-color:#4CE920;
  height: 100%;
  width: 0;
  transition: width 2s ease;
}
.ABE{
	height: 25vh;
}
.PERCENT{ font-size:15px;
	font-weight: 700;
	text-align: right;
	padding-right: 25px;
	padding-top:5px; 
}

.PERCENT1{
	font-size:12px;
	font-weight: 700;
	text-align: right;
	padding-right: 6px;
		
	
}



.Sk-row{
	padding-bottom: 20px;
}

.skill-circle-container {
  position: relative;
  width: 200px;
  height: 200px;
  margin: 0 auto;
  margin-top: 50px;
}

.skill-circle-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.skill-circle-progress {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  clip: rect(0, 100px, 200px, 0);
  border-radius: 50%;
  background-color: #4CAF50;
  transform-origin: center center;
  transform: rotate(-90deg);
}

.skill-circle-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  color: #fff;
}

.skillbar1 {
	  height: 20px;
}

.Skil-mil{
	font-size:16px;
	font-weight: 600;
}


/*---------------------rESAME----------------*/


.Res-pdf a{
	font-size: 20px;
	font-weight: 500;
	color:black;
	text-decoration: none;
}

.Res-pdf a:hover{
	text-decoration: none;
	color:black;
}

.CO-Content{
	background-color:black;
	width: 860px;
	height: 620px;
	padding-top:30px; 

}

.CON-TTLE{
	color:white;
	font-size:70px;
}

.cont1{
	height: 70vh;
	
}

.EM{
	padding-top: 7px;
}

.BG-ED{
	width: 100vw;
	height: 100vh;
	background-image: url("images/End-BG.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: left;
	
}
.cont-t{
	color:white;
}

.cont-t a{
	font-size: 20px;
	font-weight: 500;
	list-style: none;
	text-decoration: none;
	color:white;
}

.cont-t a:hover{
	text-decoration: none;
	color:white;
		list-style: none;
}


.Cres{
	margin-top:10px;
}