body {
	font: 20px Montserrat, sans-serif;
	line-height: 1.8;
	color: #f5f6f7;
}
.clip-about{
	clip-path: inset(2% 9% 2% 9%);
	background-color: #fffafc !important;
}
.skill-style{
	margin-left: 9%;
	margin-right: 9%;
	background-color: azure !important;
}
.font-about{
	color: #640095;
}
.about-head{
	font-size: xx-large;
    font-weight: bold;
	color: #555555
}
.cardp1{
	background-color: ghostwhite;
}
.cardp2{
	background-color: cornsilk;
}
.cardp3{
	background-color: greenyellow;
}
.cardp4{
	background-color: honeydew;
}
.cardp5{
	background-color: lavenderblush;
}
.cardp6{
	background-color: crimson;
}
.cardp7{
	background-color: lightcyan;
}
.cardp8{
	background-color: lightpink;
}
.cardp9{
	background-color: gold;
}
ul.cloud {
	list-style: none;
	padding-left: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	line-height: 2.5rem;
}

ul.cloud a {
	color: #a33;
	display: block;
	font-size: 1.5rem;
	padding: 0.125rem 0.25rem;
	text-decoration: none;
	position: relative;
}

ul.cloud a[data-weight="1"] { --size: 1; color: beige;}
ul.cloud a[data-weight="2"] { --size: 2; color:aqua}
ul.cloud a[data-weight="3"] { --size: 3; color:lightsalmon }
ul.cloud a[data-weight="4"] { --size: 4; color: coral; }
ul.cloud a[data-weight="5"] { --size: 5; color: mediumaquamarine;}
ul.cloud a[data-weight="6"] { --size: 6; color:mediumvioletred}
ul.cloud a[data-weight="7"] { --size: 9; color: gold;}
ul.cloud a[data-weight="8"] { --size: 12; color:yellowgreen}
ul.cloud a[data-weight="9"] { --size: 15; color: tomato;}

ul.cloud a {
  --size: 4;
  font-size: calc(var(--size) * 0.25rem + 0.5rem);
  /* ... */
}

p {
	font-size: 16px;
}

.margin {
	margin-bottom: 45px;
}

.bg-1 { 
	background-color: white; 
	color: black;
}

.bg-2 { 
	background-color: #474e5d; /* Dark Blue */
	color: #ffffff;
}

.bg-3 { 
	background-color: #ffffff; /* White */
	color: #555555;
}

.bg-4 { 
	background-color: #474e5d; 
	color: #fff;
}

.container-fluid {
	padding-top: 70px;
	padding-bottom: 70px;
}

.container-fluid-body{
	padding-top: 25px;
	padding-bottom: 25px;
}

.container-fluid-footer {
	padding-top: 10px;
	padding-bottom: 10px;
}

.navbar {
	padding-top: 15px;
	padding-bottom: 15px;
	border: 0;
	border-radius: 0;
	margin-bottom: 0;
	font-size: 12px;
	letter-spacing: 5px;
}

.navbar-nav  li a:hover {
	color: #1abc9c !important;
}

.content-div {
	margin-left: 10%;
	margin-right: 10%;
}
.socialLinks a:hover {
	color:coral !important;
}
	
.flip-card-back {
  	display:none;
}

.anim-typewriter {
	animation: typewriter 5s steps(40) 1s 1 normal both,
	blinkTextCursor 500ms steps(40) 5s normal both;
}

@keyframes typewriter {
	from {
		width:0;
	}
	to {
		width:12.8em;
	}
}

@keyframes blinkTextCursor {
	from {
		border-right-color:#212529;
	}
	to {
		border-right-color: white;
	}
}

.line {
	margin: 0 auto;
    margin-top: 2%;
    white-space: nowrap;
    overflow: hidden;
	border-right: 2px solid #212529;
	width: 9em;
	font-size: 30px;
}

.details-btn{
	margin-top: 70%;
}
.project-link{
	color: black;
}

.project-link:hover{
	color: #1abc9c !important;
}

/* time line css*/
.main-timeline{ 
	font-family: 'Poppins', sans-serif; 
}
.main-timeline:after{
	content: '';
	display: block;
	clear: both;
}
.main-timeline .timeline{
	width: calc(50% + 70px);
	margin: 0 5px 0 0;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
	float: left;
}
.main-timeline .timeline-content{
	color: #555;
	background: #fff;
	min-height: 130px;
	padding: 30px 150px 30px 30px;
	border-top: none;
	display: block;
	position: relative;
}
.main-timeline .timeline-content:before{
	content: "";
	background-color: #00C6DA;
	height: 100%;
	width: 70px;
	position: absolute;
	top: 0;
	right: 0;
}
.main-timeline .timeline-content:hover{ 
	text-decoration: none;
 }
.main-timeline .timeline-icon{
	color: #fff;
	font-size: 40px;
	line-height: 40px;
	transform: translateY(-50%);
	position: absolute;
	top: 50%;
	right: 16px;
}
.main-timeline .timeline-year{
	color: #333;
	font-size: 40px;
	font-weight: 700;
	line-height: 40px;
	text-align: center;
	transform: translateY(-50%) rotate(90deg);
	position: absolute;
	top: 50%;
	right: 60px;
}
.main-timeline .title{
	color: #00C6DA;
	font-size: 23px;
	font-weight: 600;
	text-transform: uppercase;
	margin: 0 0 5px;
}
.main-timeline .description{
	font-size: 14px;
	margin: 0;
}
.main-timeline .timeline:nth-child(even){
	float: right;
	margin: 0 0 0 5px;
}
.main-timeline .timeline:nth-child(even) .timeline-content{ 
	padding: 30px 30px 30px 150px; 
}
.main-timeline .timeline:nth-child(even) .timeline-content:before{
	right: auto;
	left: 0;
}
.main-timeline .timeline:nth-child(even) .timeline-icon{
	right: auto;
	left: 10px;
}
.main-timeline .timeline:nth-child(even) .timeline-year{
	right: auto;
	left: 60px;
}
.main-timeline .timeline:nth-child(4n+2) .timeline-content:before{ 
	background-color: #00A6F9; 
}
.main-timeline .timeline:nth-child(4n+2) .title{ 
	color: #00A6F9; 
}
.main-timeline .timeline:nth-child(4n+3) .timeline-content:before{ 
	background-color: #FF3E7D; 
}
.main-timeline .timeline:nth-child(4n+3) .title{
	color: #FF3E7D; 
}
.main-timeline .timeline:nth-child(4n+4) .timeline-content:before{ 
	background-color: #7438B9; 
}
.main-timeline .timeline:nth-child(4n+4) .title{ 
	color: #7438B9; 
}
@media screen and (max-width:767px){
	.main-timeline .timeline,
	.main-timeline .timeline:nth-child(even){
		width: 100%;
		margin: 0 0 30px;
	}
}
@media screen and (max-width:576px){
	.main-timeline .timeline .timeline-content,
	.main-timeline .timeline:nth-child(even) .timeline-content{
		padding: 130px 25px 25px;
	}
	.main-timeline .timeline .timeline-content:before,
	.main-timeline .timeline:nth-child(even) .timeline-content:before{
		height: 70px;
		width: 100%;
	}
	.main-timeline .timeline-icon,
	.main-timeline .timeline:nth-child(even) .timeline-icon{
		transform: translateY(0) translateX(-50%);
		top: 16px;
		left: 50%;
		right: auto;
	}
	.main-timeline .timeline-year,
	.main-timeline .timeline:nth-child(even) .timeline-year{
		transform: translateY(0) translateX(-50%);
		top: 80px;
		left: 50%;
		right: auto;
	}
}
/*timeline css end*/
.edu{
	color: white;
}
.edup{
	margin-bottom: 0.05rem !important;
}
