* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
html,body {
	background-color: #fff;
	scroll-behavior: smooth;
	user-select: none;
}
.navbar {
	box-shadow: 0 0.5rem 1rem rgb(0, 0, 0, .1);
}
.navbar-brand {
	font-family: 'Work Sans', sans-serif;
	font-size: 2em;
	font-weight: bold;
	color: #001e3c;
}
.my-nav-1 .nav-item .nav-link {
	background: linear-gradient(#40CCCC, #40CCCC);
	background-size: 0%;
	background-repeat: no-repeat;
	color: #333;
	border-right: 2px solid #40CCCC;
	transform: skew(20deg);
	padding: 10px 15px;
	font-size: 1.2em;
	font-weight: 500;
}
.my-nav-1 .nav-item .nav-link:hover {
	animation: slide-in 0.5s ease;
	animation-fill-mode: forwards;
}
.my-nav-1 .nav-item .nav-link:not(:hover) {
	animation: slide-out 0.5s ease;
	animation-fill-mode: forwards;
}
.my-nav-1 .nav-item .nav-link.active {
	animation: none;
	background-size: 100%;
	color: #333;
}
.my-nav-1 .nav-item:nth-last-child(1) .nav-link {
	border-right: 2px solid #FFF;
}
.my-nav-1 .nav-item .nav-link span {
	display: inline-block;
	transform: skew(-20deg);
}
.my-nav-2 .nav-item .nav-link {
	background-color: #40CCCC;
	border: 2px solid #40CCCC;
	color: #333;
	padding: 10px 30px;
	font-weight: 500;
}
.my-nav-2 .nav-item .nav-link:hover,
.my-nav-2 .nav-item .nav-link:focus {
	background: transparent;
	color: #333;
	border: 2px solid #333;
}
.navbar-toggler,
.navbar-toggler:hover,
.navbar-toggler:focus {
	border: none;
	box-shadow: none;
}
.offcanvas.offcanvas-start {
	width: 80%;
}
#sidemenu .nav-item .nav-link {
	padding: 15px 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #333;
	font-family: 'Roboto', sans-serif;
	font-size: 1.1em;
	font-weight: 500;
}
#sidemenu .contact-btn {
	display: block;
	padding: 12px 20px;
	font-family: 'Roboto', sans-serif;
	font-size: 1em;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	background-color: #40CCCC;
	color: #333;
}

footer {
	font-family: 'Roboto', sans-serif;
	color: white;
}
footer .table tr td {
	padding: 0;
	padding-bottom: 1em;
}
footer .table tr td i {
	margin-right: 1em;
	color: #40CCCC;
}
footer h4 {
	font-size: 1.4rem;
	font-weight: bold;
	color: white;
}
footer h5 {
	font-size: 1.2rem;
	font-weight: bold;
	color: white;
}
footer p {
	font-size: 1rem;
	font-weight: 500;
	color: white;
}
footer a {
	font-size: 1rem;
	font-weight: 500;
	text-decoration: none;
	color: white;
	letter-spacing: 1px;
}
footer .nav-item .nav-link {
	display: inline-block;
	text-decoration: none;
	color: white;
	font-weight: 500;
	padding: 5px 0;
	margin-bottom: 10px;
	letter-spacing: 1px;
}
footer .nav.flex-column .nav-item .nav-link i {
	color: #40CCCC;
}
footer .social-links .nav-item .nav-link {
	font-size: 2em;
	margin-right: 10px;
	padding: 0;
	color: white;
	letter-spacing: 1px;
}
footer a:hover, footer a:focus,
footer .nav-item .nav-link:hover,
footer .nav-item .nav-link:focus {
	color: #40CCCC;
	font-weight: 800;
}

@keyframes slide-in {
	from {
		background-size: 0%;
		color: #333;
	}
	to {
		background-size: 100%;
		color: #333;
	}
}
@keyframes slide-out {
	from {
		background-size: 100%;
		color: #333;
	}
	to {
		background-size: 0%;
		color: #333;
	}
}
@media(min-width: 768px) {
	.offcanvas.offcanvas-start {
		width: 400px;
	}
}
@media(min-width: 1400px) {
	.navbar {
		padding: 20px 40px;
	}
	.navbar-brand {
		min-width: 200px;
	}
	.my-nav-1 .nav-item .nav-link {
    	padding: 10px 25px;
    }
	.my-nav-2 {
		min-width: 200px;
	}
}