:root {
  --brand-red: #b52128;
  --brand-black: #3c3c3b;
//  --brand-blue: rgb(99,102,241);
	--brand-blue: rgb(59 130 246);;
}

header .logo {width:120px;}
footer .logo {width:80px;}
footer .logo img{width:100%;}

header .links a {
	padding: 10px 20px;
	transition:all 0.2s;
}


header .button {
	border: 1px solid var(--brand-red);

}

header .button svg {min-width:40px;}

header .button:hover {
	border-color:white; 
	transition:all 0.2s;
}

header .button:hover svg{
	padding-left:20px;	
	transition:all 0.3s;
}


header .links a:hover {
	background-color:rgba(255,255,255,0.1);
	border-radius: 2px;
}

.red {
	color: var(--brand-red) !important;
}

.black {
	color: var(--brand-black) !important;
}


.bg-red {
	background-color: var(--brand-red) !important;
}


.hero {
	background:url('/assets/images/circuit.jpg');
	background-size:cover;
	background-position: center;
  	background-repeat: no-repeat;
}

.developer img {width:20px} 
.developer span {display:inline-block;    vertical-align:middle;
}


.blue {
	color:var(--brand-blue);
}

.border-blue {
	border:1px solid var(--brand-blue);
}



.links .active {border-bottom:1px solid var(--brand-red)}