/*menu*/
.bg-light {
	background-color: rgb(255, 255, 255) !important;
}

.navbar {
	padding: 0 1em;
}

.container {
	max-width: 70em;
	border-bottom: 2px solid  rgb(102, 45, 145);
	padding: 0 1em;
}

.navbar-brand .logo {
	width: 80%;
}

.navbar-collapse {
	flex-grow: 0;
}

.navbar-light .navbar-nav .nav-link {
	color: rgb(102, 45, 145);
	font-family: 'Lato', sans-serif;
	font-size: 1.25em;
	text-transform: uppercase;
	padding: 1.25em 1em;
	transition: 20ms;
	transition-timing-function: ease-in-out;
}

.navbar-light .navbar-nav .nav-link:hover {
	color: rgb(255, 255, 255);
	background: rgb(141, 198, 68) !important;
	padding: 1.25em 1em;
}

.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
	color: rgb(255, 255, 255);
	background: rgb(141, 198, 68) !important;
	padding: 1.25em 1em;
}

/*button*/
.navbar-light .navbar-toggler {
	margin: 1em;
	border: none;
	outline: 0;
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width:992px) and (max-width:1200px) {
	.container {
		max-width: 60em;
		padding: 0 0.8em;
	}

	.navbar-brand .logo {
		margin-left: 1em;
	}

}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width:768px) and (max-width:991px) {
	.navbar-brand .logo {
		margin-left: 2em;
	}

}

@media only screen and (min-width:568px) and (max-width:767px) {
	.navbar-brand .logo {
		width: 50%;
		margin-left: 1em;
	}

	.navbar-light .navbar-toggler {
		margin: 0.15em;
	}

}

@media only screen and (max-width:567px) {
	.navbar-brand {
		margin-right: 0;
		max-width: 200px;
	}
	.navbar-brand .logo {
		width: 50%;
		margin: 0.5em 0.5em 0.5em 0;
	}

	.navbar-light .navbar-toggler {
		margin: 0.18em;
	}
	.navbar-toggler{
		padding: 0;
	}

}
