@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;1,300;1,400&display=swap');

:root{
	--orange: #ff7800;
	--black: #27272f;
	--light-color: #666;
	--box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.1);
	--border: .2rem solid rgba(0,0,0,.1);
	--outline: .1rem solid rgba(0,0,0,.1);
	--outline-hover: 1rem solid var(--black);
}

body, nav{
font-family: 'Rubik', sans-serif;
background-color: var(--black);
}

.nav-link{
	color: white;
}

.nav-link:hover{
	color: var(--orange);
}

.card {
box-shadow: 2px 2px 5px 4px rgba(0, 0, 0, 0.25), -2px -2px 10px 4px rgba(0, 0, 0, 0.22);
transition: all .4s ease-in-out;
background-color: darkslategray;
}
.card:hover {
box-shadow: 0px -1px 14px 0px rgba(17,245,154,1);
transform: scale(1.01);
}


/****************/

/* width */
::-webkit-scrollbar {
width: 10px;
}
/* Track */
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px grey;
border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
background: gray;
border-radius: 10px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #b30000;
}
/******************/