@media (min-width: 1200px) {
	.navbar-light .navbar-nav .nav-item{position:static; padding: 25px 0px;}
	.navbar-light .navbar-nav .nav-link {color:#000; font-size:21px; font-weight:700;}
	.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link,.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{color:#90BED2;}
	.navbar-light .navbar-nav li+li .nav-link {margin-left:5px;}

	.dropdown:hover>.dropdown-menu {
		opacity: 1;
		visibility: visible;
		
	}
	
	.dropdown:hover .dropdown-toggle::after{
		-moz-transform: rotate(180deg);
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
		transition: all 0.3s ease;
	}
	
	.mega-menu {
		padding: 40px 0;
		width: 100%;
		z-index: 9;
		left: 0;
		top: calc(100% - 1px);
		opacity: 0;
		visibility: hidden;
		display:block;
		transition: all 0.3s ease;
		box-shadow: 0px 4px 5px 0px rgb(0 0 0 / 17%);
		background: rgba(0, 0, 0, 0.97);
	}

	.mega-menu .sub-menu-image img {
		display: block;
		border-radius: 5px;
		width: 100%;
		max-width: 320px;
	}
	.mega-menu a{position:relative;font-size:17px;}
	.mega-menu a:not(.btn):before{
		content: '';
		position: absolute;
		width: 100%;
		height: 3px;
		border-radius: 4px;
		bottom: -5px;
		left: 0;
		transform-origin: right;
		transform: scaleX(0);
		transition: transform .3s ease-in-out;
		background-color: #0DCAF0;
	}
	
	.mega-menu a:not(.btn):hover:before{
		transform-origin: left;
		transform: scaleX(1);
	}
	.dropdown-toggle::after{vertical-align:.1em!important;}
}


@media (max-width: 1199.98px) {
	.offcanvas-collapse {
		position: fixed;
		top: 0px;
		bottom: 0;
		right: 100%;
		width: 100%;
		padding-right: 1rem;
		padding-left: 1rem;
		overflow-y: auto;
		visibility: hidden;
		background-color: #fff;
		transition: transform .3s ease-in-out, visibility .3s ease-in-out;
		z-index: 9;
	}
	.offcanvas-collapse.open {
		visibility: visible;
		transform: translateX(100%);
	}
	
	.navbar-light .navbar-nav li+li{
		border-top: 1px solid #ccc;
	}

	.dropdown-toggle::after {
		float: right;
		margin: 12px 15px 0px 0px;
		border: none;
		--b: 2px;
		width: 13px;
		aspect-ratio: 1;
		background: conic-gradient(from 90deg at var(--b) var(--b), #fff 90deg, #000 0) calc(100% + var(--b) / 2) calc(100% + var(--b) / 2) / calc(50% + var(--b)) calc(50% + var(--b));
	}
	
	.dropdown-toggle.show::after{
		background: none;
        content: "-";
        margin: 0 13px 0 0;
        font-size: 45px;
        line-height: 0.7;
	}
	
	.dropdown-menu {
		border: none;
		margin:0;
		padding:0;
	}
	
	.dropdown-menu .nav-item{
		line-height: 2;
	}
}