/* CSS Document */

body{
	overflow-x: hidden;
}

.about-panel {
	background-color:var(--about-panal);
	padding: 30px;
	border-bottom: 3px solid var(--circle-color);
}

.tags>span {
	background-color: #5B5B5B;
	border-radius: 3px;
	padding: 3px 5px;
	margin: 3px;
	color: white;
	display: inline-block;
	font-size: 1vw;
}

.about-panel p,
.about-panel h3 {
	color: white;
}

.about-panel h3 {
	font-size: 1.8vw;
}

.about-panel h3:before {
	content: ': ';
	color: orangered;
}

.about-panel h4 {
	color: white;
	font-size: 1.4vw;
}

.about-panel h4:before {
	color: var(--icon-btn);
	content: '> ';
}

.ab-first-row p {
	margin-bottom: 1px;
}

.icon-bar {
	/*  position: fixed;*/
	/*  top: 50%;*/
	/*  -webkit-transform: translateY(-50%);*/
	/*  -ms-transform: translateY(-50%);*/
	/*  transform: translateY(-50%);*/
}

.icon-bar a {
	display: inline-block;
	text-align: center;
	padding: 12px 18px;
	transition: all 0.3s ease;
	color: var(--bg-color);
	font-size: 20px;
	border-radius: 50%;
}

.icon-bar a:hover {
	background-color: var(--icon-btn);
}

.facebook {
	background: #3B5998;
	color: white;
}

.twitter {
	background: #55ACEE;
	color: white;
}

.google {
	background: #dd4b39;
	color: white;
}

.linkedin {
	background: #007bb5;
	color: white;
}


.bg-pan {

	background-color: var(--circle-bg-color);
	width: 90%;

}

.ab-btn {
	color: var(--bg-color) !important;
	background-color: var(--icon-btn) !important;
}
.ab-btn:hover{
	transition: 1.5s all; 
	color:  var(--icon-btn) !important;
	background-color:var(--bg-color) !important;
}